メニューリストの XUL アイテムでオートコンプリートの動作を模倣したいと考えています (元のオートコンプリート コンポーネントは私の場合には実用的ではないため、実際にはこれを使用してから XPCOM コンポーネント全体を作成する方が簡単です)。
ただし、問題の部分は、プログラムでオプションを表示するドロップダウン部分を開くことです。つまり、下矢印ボタンを押して開く必要はありません。入力したときに開く (または一致するオプションがない場合は閉じる) ようにします。文字入力はできるので、同じハンドラでドロップダウン部分の開閉をしたいのですが、方法はありますか?
編集
以下は、私がコンポーネントに使用している XUL ファイルの簡単な例です。
<?xml version="1.0"?>
<?xml-stylesheet href="chrome://global/skin/global.css" type="text/css"?>
<dialog id="whatever" title="Select a tab to open"
xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"
buttons="accept,cancel"
buttonlabelcancel="Cancel"
buttonlabelaccept="Save"
ondialogaccept="return doOK();"
ondialogcancel="return doCancel();">
<dialogheader title="Select tab"/>
<menulist id="search-box" editable="true"
oncommand="commandHandler(event)"
onkeyup="keyUpHandler(event)"/>
<script>
var a = window.arguments[0];
var opener = window.arguments[1];
var menu = document.getElementById('search-box');
function doOK()
{
opener.selectTabAtIndex(a.indexOf(menu.value));
return true;
}
function doCancel(){ return true; }
function commandHandler(event)
{
doOK();
window.close();
}
function keyUpHandler(event)
{
var v = menu.value;
menu.removeAllItems();
populate(a.filter(function (x, i)
{
if (x == v) opener.selectTabAtIndex(i);
return x.indexOf(v) > -1;
}));
}
function populate(choices)
{
for (var i = choices.length - 1, s; i >= 0; i--)
{
s = choices[i];
menu.appendItem(s, s);
}
}
menu.focus();
menu.select();
populate(a);
menu.open = true;
</script>
</dialog>
ご覧のとおり、 menu.open = true はそれに影響しません。
編集2
私も試しました:
var e = document.createEvent("KeyboardEvent");
e.initEvent("keydown", true, false, menu, false, false, false, false, 0, 40);
menu.dispatchEvent(e);
keydown / keyup / keypress のバリエーションと、キーコードと charcode と yada-yada の切り替えは、すべて効果がありません。
私は API が好きで、古き良き WinAPI を思い起こさせますが、役に立たない引数はまだ十分ではありません