TabIndex property in chrome/ff and jquery not working together?

I'm using jquery 1.6 and want to execute this code in my iframe:

$(document).bind('keydown', function (e) {
    if (e.which == 9) {
        var tabbie = $(e.target).attr('tabIndex');
        if (tabbie) {
            var el 开发者_如何学C= $("*[tabIndex='" + (parseInt(tabbie) + 1) + "'");
            if (el.length) {
                // do standard action
            }
            else {
                e.preventDefault();
                window.top.focus();
                return false;
            }
        }
    }
});

As you can see, what it should do: On tab-keypress, see if there is an element with a next tabindex value. If so, all is good, let the browser go to it. If there isn't, then give focus to the parent of the iframe.

This works in IE8, but in chrome/FF it doesn't: you cannot tab anything, even though the html has tabindexes:

<div class="row fl-controls-left">
    <input id="username" name="username" tabindex="1" type="text" value="" size="25" autocomplete="false"/>
</div>
<div class="row fl-controls-left last">
    <input id="password" name="password" tabindex="2" type="password" value="" size="25" autocomplete="off"/>
</div>
<div class="actions rounded-bottom">
    <a href="javascript:void(window.top.location.href = 'http://localhost/')" tabindex="4">Forgot?</a>
    <div class="row btn-row">
        <input name="submit" value="Aanmelden" tabindex="3" type="submit" />
        <input name="reset" value="leegmaken" tabindex="1000" type="reset" />
    </div>
</div>

Anyone know why?

(Why I want this code? To answer my other question Tabindex to skip iframe but not content inside)

Cheers!