jQuery 触发器在选定的下拉选项上单击（或选择）

Question

我正在尝试使用 jQuery 在所选的下拉选项上触发页面加载时的点击功能，以便可以进行后续操作，但无法使其正常工作。

我试过了：

 jQuery("document").ready(function() {
setTimeout(function() {
    jQuery("customlist_chzn_o_2").trigger('click');
},10);

或者

jQuery("document").ready(function() {
    jQuery('#customlist').val(9).trigger("chosen:updated")
});

或者

jQuery("document").ready(function() {
    jQuery('#customlist_chzn_o_2').trigger("chosen:updated")
});

它们都不起作用，请注意我选择的 id 是 #customlist 我需要单击的 selected 下拉元素的 id 是 #customlist_chzn_o_2 并且选择选项的值为 9

原文由 Ishan 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 1

如果我理解正确，您需要在原始的 select 上触发 change 事件，而不是在自定义或他的 option 上触发。

使用表单域时，您通常希望在选择或取消选择值后执行某些操作。每当用户在 Chosen 中选择一个字段时，它会触发原始表单字段上的“更改”事件

但是当 你 改变原来的 select 值 时，你应该触发 chosen:updated 。

如果您需要更新选择字段中的选项并希望 Chosen 接受更改，则需要触发该字段上的“chosen:updated”事件。 Chosen 将根据更新的内容重新构建自己。

https://harvesthq.github.io/chosen/#change-update-events

 var sel1 = $('#sel1').chosen({width: '150px'}).change(function(){
  console.log($(this).val());
});

sel1.trigger('change');

var sel2 = $('#custom_field').chosen({width: '150px'});

//$('button').click(function() {
$(document).ready(function() {
  sel2.val('9');

  // Than you should trigger the "chosen:updated"
  sel2.trigger('chosen:updated');
});

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/chosen/1.6.2/chosen.jquery.js"></script>
<link href="https://cdnjs.cloudflare.com/ajax/libs/chosen/1.6.2/chosen.min.css" rel="stylesheet"/>

<select id="sel1">
  <option>option 1</option>
  <option>option 2</option>
  <option>option 3</option>
</select>
<hr />
<select id="custom_field">
  <option>option 1</option>
  <option>option 2</option>
  <option>9</option>
</select>

<button>Set custom_field's value to "9"</button>

原文由 Mosh Feu 发布，翻译遵循 CC BY-SA 3.0 许可协议

Answer 2

要实际“触发”点击事件，就像它是由用户制作的一样，我必须按如下方式组合多个答案：

         $('#sel1')[0].selectedIndex = 0; // make selection
        $('#sel1')[0].focus(); // set the focus
        $('#sel1').trigger('change'); // actually trigger click event for listeners

原文由 Gene Bo 发布，翻译遵循 CC BY-SA 4.0 许可协议