如何在下拉框变更时用jQuery触发按钮的双击事件？

要实现下拉选择框选项变更时触发按钮的双击事件，需确保按钮已绑定双击逻辑，再通过下拉框的change事件触发按钮的双击行为。

完整代码示例 #

HTML代码

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<select name="fruits" id="fruitIds" style="width: 140px;">
  <option selected="selected" value="">Days</option>
  <option value="5">5 Days</option>
  <option value="10">10 Days</option>
  <option value="15">15 Days</option>
  <option value="20">20 Days</option>
  <option value="25">25 Days</option>
</select>

<button type="button" class="btn btn-primary btn1" id="btn-search">Apply Filter</button>

JavaScript代码

// 为按钮绑定双击事件的业务逻辑
$("#btn-search").dblclick(function() {
  console.log("按钮双击事件已触发");
  // 此处添加双击按钮后需执行的具体逻辑
});

// 下拉框选项变更时，触发按钮的双击事件
$('#fruitIds').change(function() {
  $("#btn-search").dblclick();
});

关键说明 #

• 必须先给按钮绑定双击事件的处理函数，否则调用.dblclick()不会产生任何效果
• 下拉框的change事件触发后，通过$("#btn-search").dblclick()即可模拟用户双击按钮的行为

内容的提问来源于stack exchange，提问作者Alex Aniapam