小编aar*_*ryy的帖子

单击jQueryUI菜单项时,无法在jQuery UI对话框中将焦点设置为表单字段

我有一个包含单字段表单的jQuery UI对话框,autoOpen属性在开头设置为false.页面上还有另一个jQuery UI菜单,对话框的open函数绑定到菜单项的click事件.我一直试图将焦点设置到对话框的唯一表单字段,当对话框打开时单击菜单项不知何故没有运气.为了查明原因,我还添加了另一个测试按钮,通过单击该按钮,我可以将焦点设置到表单域.所以我很确定这是jQuery UI菜单阻止了该领域的焦点.我想知道是否有任何办法可以绕过这种限制.任何见解都表示赞赏.谢谢!

HTML:

<ul id="menu">
    <li><a href="#">Item 1</a></li>
    <li><a href="#">Item 2</a></li>
</ul>
</br>
<button id="btn">Open the dialog</button>

<div id="dialog" title="Basic dialog">
    <form>
        <input type="text" id="fld" />
    </form>
</div>
Run Code Online (Sandbox Code Playgroud)

JavaScript的:

$( "#dialog" ).dialog({
    autoOpen: false,
    open: function(event, ui){
        $('#fld').focus();
    }
});

$('#btn').click(function(e){
    $( "#dialog" ).dialog('open');
});

$('#menu li a').click(function(){
    $( "#dialog" ).dialog('open');
})

$( "#menu" ).menu({
    select: function( event, ui ) {
        $( "#dialog" ).dialog('open');
    }
});
Run Code Online (Sandbox Code Playgroud)

这是js小提琴

javascript jquery jquery-ui-dialog jquery-ui-menu

5
推荐指数
1
解决办法
6766
查看次数