Question

First, I know that there are jQuery plugins for search suggest. The reason I’m asking this is because I wrote one for my specific needs and I am interested in learning how to make the script in jQuery (rather than just using a plugin). See code that I pasted to pastebin — I hope that’s ok.

Original: http://pastebin.com/VFuXY4iX

Somewhat jQuerified: http://pastebin.com/S86ES8bH

The two things that I am struggling with are as follows:

— The original (and the jQuery one currently) accesses child nodes by their DOM child index (see unhilite() function). I haven’t found a way to do this in jQuery. The closest thing that I can find is .next("selector"), but the elements don’t have a selector that I can key on except for the DOM index. I was thinking of overcoming this by doing something like:

$('.hilited')
    .next('li')
        .addClass('hilited')
    .end()
    .removeClass('hilited');

Would this work well? Edit: even if it does work well, is there a way to access DOM indexes like that (for future reference)?

— Second, I don’t know specifically how to bind keyboard events with jQuery (without using a plugin, which I want to avoid – again for learning purposes). I think bind() or keydown() might work, though.

$('#target').keydown(function(event) {
    if (event.keyCode == '40') {
        //next
    } else if (event.keyCode == '40') {
        //previous
    }
)};

Anybody have any suggestions? Thanks SO, you’re my favorite!

PS- sajax_do_call is Mediawiki AJAX syntax for anyone that isn’t familiar…

Answer 1

I answered some of my own question. I could use jQuery’s nth child selector if I wanted to. The other suggested solutions do work, but i’d still be open to suggestions.