javascript - 在选择更改时打开下一个选择元素

标签 javascript jquery html forms triggers

我有几个连续的选择元素,用户必须在其中选择一个选项。为了方便用户并确保他们选择一个选项,我正在尝试做的事情是在选择选项后自动打开下一个选择

fiddle http://jsfiddle.net/zYUfd/1/

HTML

<form>
    <select name="first">
        <option value=""></option>
        <option value="1">one</option>
        <option value="2">two</option>
        <option value="3">three</option>
    </select> 
    <select name="two">
        <option value=""></option>
        <option value="1">one</option>
        <option value="2">two</option>
        <option value="3">three</option>
    </select> 
    <select name="three">
        <option value=""></option>
        <option value="1">one</option>
        <option value="2">two</option>
        <option value="3">three</option>
    </select> 
</form>

jquery

$('select').on('change', function() {
   $('.select').next().trigger('click'); 
});

最佳答案

工作演示:http://jsfiddle.net/4cgt3/还有这个http://jsfiddle.net/4cgt3/3/

旧的 SO 引用:Open a select drop down on click of checkbox using jquery

希望这能满足您的需求:)

代码

$('select').on('change', function () {

    'use strict';
       $(this).next().focus().get(0).dispatchEvent(doClick());

});

var doClick = function () {
    'use strict';
    var event = document.createEvent('MouseEvents');
    event.initMouseEvent('mousedown', true, true, window);
    return event;
}

关于javascript - 在选择更改时打开下一个选择元素,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/22026412/

相关文章:

javascript - Ember 的 registerBoundHelper 和 Handlebars block

javascript - Bootstrap Affix Nav 导致下面的div跳起来

jquery - 使用 JavaScript 提交 Rails 远程表单

javascript - HTML/CSS/DropDown onClick 修改

php 通过循环更新

javascript - 如何使元素在拖动时恢复到原来的位置?

javascript - 使用 HTML、CSS 和 JS 的侧边栏多级下拉菜单

javascript - 将登录表单表格对齐到屏幕的顶部中间

javascript - 更改背景颜色范围

JQuery DataTable 单击时禁用 "select row"