javascript - jQuery UI 子菜单中的输入字段不起作用

Question

我有这个例子:http://jsfiddle.net/VPXjs/137/

HTML:

<ul id="menu" style="width: 150px;">
<li class="ui-state-disabled"><a href="#">Aberdeen</a></li>
<li><a href="#">Ada</a></li>
<li><a href="#">Adamsville</a></li>
<li><a href="#">Addyston</a></li>
<li>
<a href="#">Delphi</a>
<ul>
<li class="ui-state-disabled"><a href="#">Ada</a></li>
<li><a href="#">Saarland</a></li>
<li><a href="#">Salzburg</a></li>
<li><a href="#">quick search <input type='text' name='foobox' size='5' /></a></li>
</ul>
</li>
</ul>

jQuery:

$(function() {
    $( "#menu" ).menu();
}); 

如何让子菜单在我按下输入框时不关闭？此外，似乎输入字段被禁用了，因为如果我输入速度足够快，我什至无法输入。

Answer 1

我必须绑定(bind)到输入的点击事件，停止传播，然后关注它:

$('input').click(function (e) {
    e.stopPropagation();
    $(this).focus();
})

jsFiddle example