javascript - 使用 jQuery 在另一个事件发生更改事件后弹出下拉菜单

Question

我有 2 个下拉菜单，我想这样做，以便当有人在一个下拉菜单中选择时，另一个下拉菜单应该自动弹出，以便用户需要单击才能打开第二个下拉菜单。

<select id="dropdwon1">
 <option value="1">Item1</option>
 <option value="2">Item2</option>
 <option value="3">Item3</option>
</select>

<select id="dropdwon2">
 <option value="1">Item1</option>
 <option value="2">Item2</option>
 <option value="3">Item3</option>
</select>

jquery 是

$("#dropdwon1").change(function(){
            $( "#dropdwon2" ).focus();
            $( "#dropdwon2" ).click();
});

我也将此代码快照放入 jsfiddle 中。 https://jsfiddle.net/nandkumar90/z0bc2wyt/

在第一个下拉菜单中进行选择后的预期结果 有人可以指导达到预期结果吗？

Answer 1

我已经用工作代码更新了你的 fiddle ，请关注https://jsfiddle.net/Nishith/z0bc2wyt/1/

var e = document.createEvent('MouseEvents');
e.initMouseEvent('mousedown');
$("#dropdwon2")[0].dispatchEvent(e);