jquery 1.6 を使用しており、iframe でこのコードを実行したい:
$(document).bind('keydown', function (e) {
if (e.which == 9) {
var tabbie = $(e.target).attr('tabIndex');
if (tabbie) {
var el = $("*[tabIndex='" + (parseInt(tabbie) + 1) + "'");
if (el.length) {
// do standard action
}
else {
e.preventDefault();
window.top.focus();
return false;
}
}
}
});
ご覧のとおり、何をすべきか: tab-keypress で、次の tabindex 値を持つ要素があるかどうかを確認します。もしそうなら、すべて問題ありません。ブラウザをそれに移動させてください。存在しない場合は、iframe の親にフォーカスを与えます。
これは IE8 では機能しますが、chrome/FF では機能しません。html にタブインデックスがあっても、タブを使用することはできません。
<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>
理由を知っている人はいますか?
(なぜこのコードが必要なのですか?他の質問に答えるためにTabindex to skip iframe but not content inside )
乾杯!