Question

基本上我正在扩展这个问题jQuery Combobox/select autocomplete? 在这里，我更新了fiddle code here。问题是，如果我从第一个菜单中遇到某些条件（如果主菜单选择值是2），我想在子菜单的输入字段中设置焦点。这是我的代码： HTML：

<select id="mainmenu" style="width:300px">
    <option value>Select from menu</option>
    <option value="one">One</option>
    <option value="two">Two</option>
    <option value="three">Three</option>
</select>
<select id="submenu" style="width:300px">
    <option value>Select from submenu</option>
    <option value="a">A</option>
    <option value="b">B</option>
    <option value="c">C</option>
</select>

脚本：

$(function(){
    $('select').combobox();
});

$( document ).ready(function() {

    console.log("console logging.");
    $('#mainmenu').change(function() {
            var selectVal = $('#mainmenu :selected').val();
            console.log("selected: " + selectVal);
            if(selectVal == 'two'){
                console.log("value: "+selectVal);
                //$('#submenu ~ input:first').autocomplete("search", "");
                $('#submenu ~ input:first').focus();
            }
        });
});

Answer 1

使用jQuery-UI＆＃39; selectmenu widget：

HTML

<select id="mainmenu" style="width:300px">
    <option value>Select from menu</option>
    <option value="one">One</option>
    <option value="two">Two</option>
    <option value="three">Three</option>
</select>
<select id="submenu" style="width:300px">
    <option value>Select from submenu</option>
    <option value="a">A</option>
    <option value="b">B</option>
    <option value="c">C</option>
</select>

JS

$(function () {
    $('#mainmenu, #submenu').selectmenu();
    $('#mainmenu').selectmenu({
        'change': function (e, ui) {
            var selectVal = $('option:selected', this).val();
            if (selectVal == 'two') {
                $('#submenu').selectmenu('open');
                $('#submenu option:eq(1)').focus();
            }
        }
    });
});

此处有JSFiddle证明

Answer 2

您需要绑定此onchange combobox事件$("#mainmenu").combobox({...，然后使用focus设置$('#submenu').next().find('input').focus();

这里有完整的代码：

$( document ).ready(function() {
$("#mainmenu").combobox({
        selected: function (event, ui) {
           var selectVal = $('#mainmenu :selected').val();
            if(selectVal=='two'){
             $('#submenu').next().find('input').focus();
            }
        }
    });
});

<强> DEMO

无法专注于jquery选择小部件动态输入字段

2 个答案: