如何使用触发器打开下拉列表?
以下代码不起作用:
$('select').trigger('click');
仅供注意 - mousedown和mouseup也不起作用。
答案 0 :(得分:11)
$('select').children('option').each(function() {
if ($(this).is(':selected'))
{ $(this).trigger('change'); }
});
答案 1 :(得分:9)
你想要达到的目标是不可能的。即使您触发click,下拉列表也不会打开,就像用户点击它一样。如果要使用新值更改当前选定的值,可以使用val功能。我想唯一的解决方案是使用div来模拟select
元素的整个UI外观。
答案 2 :(得分:7)
我花了一段时间但找到了解决方案:
(仅限Chrome和Safari)
function open(elem) {
if (document.createEvent) {
var e = document.createEvent("MouseEvents");
e.initMouseEvent("mousedown", true, true, window, 0, 0, 0, 0, 0, false, false, false, false, 0, null);
elem[0].dispatchEvent(e);
} else if (element.fireEvent) {
elem[0].fireEvent("onmousedown");
}
}
答案 3 :(得分:4)
没有正确的方法可以通过编程方式点击下拉列表。
您可以通过以下方式选择选项:
$('#sourceOptions>option:eq(0)').prop('selected', 'selected');
如果您想模拟用户点击:您必须按照@Renso所说的那样进行:
$('#sourceOptions>option:eq(0)').prop('selected', 'selected').trigger('change');
答案 4 :(得分:0)
给它一个大小而不是触发器。 只需打开选择(在Chrome中测试):
/////// $('select').trigger('click');
$('select')[0].size = 10;
答案 5 :(得分:-1)
您可以执行以下操作:
HTML:
<form>
<select>
<option value="opt1">Option 1</option>
<option value="opt2">Option 2</option>
<option value="opt3">Option 3</option>
</select>
<input type="submit" value="OK"></input>
</form>
Javascript(使用jquery):
$("option[value='opt2']").attr("selected", "selected"); // Selects option 2
$("input[type='submit']").trigger("click"); // Submits the form