用jquery模拟鼠标点击选择选项答案

【问题标题】：simulating mouse click on select option with jquery用jquery模拟鼠标点击选择选项
【发布时间】：2012-05-05 15:42:05
【问题描述】：

当我单击 Select 选项时，我正在处理 Changed 事件。

我想在代码中模拟这个，让它看起来和用户点击选项时一样。

到目前为止，在选项上设置 'selected' 属性并不会像单击它时那样突出显示它。

我可以在选项上触发“更改”并点击我的处理程序，但列表上的选项没有被选中，就像被点击一样。

建议？

更新：查询选择代码工作得很好 - 感谢您的回复。问题是我的（当然）。我在 Jquery.Ajax Success: 块之外有选择代码，所以我认为它正在工作，但 ajax 响应代码正在处理它。

【问题讨论】：

【解决方案1】：

$("option").attr("selected","selected");

将选择您想要的选项。然后您可以触发事件。

不要忘记使用以下命令清除其他选项的选定属性：

$("option").attr("selected",null);

或

$("option").removeAttr("selected");

【讨论】：

【解决方案2】：

$('option[value="4"]').attr('selected', 'selected').parent().focus();

【讨论】：

这很好奇。运行此操作后，该元素周围有一个非常浅的灰色框 - 它已被选中，但当您用鼠标单击它时不会突出显示（蓝色）。列表框有焦点，当我向上/向下箭头时，然后选择所选元素上方或下方的选项并以我想要的样式突出显示蓝色！

【解决方案3】：

...但是列表上的选项没有被选中，就像被点击一样。

我不完全理解您要做什么，但$('select').change() 的工作方式类似于$('select option').click()。在change 事件中$(this).val() 是所选选项的值，在click 事件中也是如此。

无论哪种情况，您都可以选择带有$('select[value="yourvalue"]').prop('selected', true);的选项

【讨论】：

我应该详细说明。当我单击选项时，会发生两件事：选项元素以蓝色突出显示（显然是某种样式更改）。其次，更改事件被触发。在代码中为选项设置 'selected' 属性不会应用与单击时相同的视觉样式。
selects 很棘手，您无法设置它们的样式，并且它们取决于操作系统。

【解决方案4】：

我正在使用 jquery 数据表插件 ColumnFilterWidgets，我需要执行以下操作来执行过滤操作（基于 elclanrs 和 Ben Foster 的回答）：

$("option").attr('selected', 'selected').parent().focus();
$("option").parent().change();

【讨论】：