私は、多くのボタンをホストするjQuery UIダイアログを持っています。jQuery UIダイアログがフォーカスを奪う
これらのボタンでキーボードコントロール(タブナビゲーション)を使用したいので、ダイアログのオープンイベントハンドラで、最初のボタンをフォーカスに設定します。
私はこれが目に見え、document.activeElementを使って確認することもできますが、フォーカスが奪われてフォーカスが得られます。
これまでのところ、私はそれ以上のフックを持っていないので、どのようにフォーカスを持っているかを知っているとは思いません。
他にも同様の問題がありますか?あなたが興味を持っている場合は
、私のコードは、この(後述のようにフォーカスを追加する改正)doc.readyで
ある - ノート私はそれにjQueryのボタンをも追加しました - しかし、彼らはドン」すべてのキーボードイベントに対応しているようですが、それは別の質問です。
$("#dialogSearchType").dialog
(
{
bgiframe: true,
height: 180,
width: 350,
modal: true,
autoOpen: false,
show: 'drop',
hide: 'fold',
buttons: { "Street": function() { HandleSearchStreetClick(); $(this).dialog("close"); },
"Property": function() { HandleSearchPropertyClick(); $(this).dialog("close"); }
},
focus: function(event, ui) { $("#btnSearchTypeProperty").focus(); }
}
);
<div id="dialogSearchType" class="searchDialog" style="width: 280px; display: none" title="Search For..." onkeyup="HandleSearchTypeDialogKeyUp(event)">
<span>What would you like to search for?</span>
<br />
<input type="button" tabindex="1" id="btnSearchTypeStreet" class="button" value="Street" onclick="HandleDialogSearchStreetClick()" />
<input type="button" tabindex="2" id="btnSearchTypeProperty" class="button" value="Property" />
</div>
ご覧のとおり、途中でイベントハンドラを追加しようとしましたが、何も起こりません。
を働いた興味深いソリューションを見つけることができるおかげで、悲しいことに、これは動作しませんでした - 私は私のQを編集し、コードスニペットを追加しました。私が持っている他のBIG Q(私は別の質問として開きます)は、組み込みのボタン(ボタンオプションを使用)はキーボード入力を全く受けないということです。 jQuery UIが表示されているときに、これらのいずれかにフォーカスが設定されていることがわかりますが、動作するキーボードイベントはダイアログを閉じるESCだけです! :( – Duncan