如何在jQuery中通过点击按钮触发下拉框的change事件并切换选项?
解决方法
没问题,我来帮你调整代码,实现点击按钮时切换下拉框选项并触发change事件的需求:
首先你得明白,原来的代码只是触发了change事件,但没有修改下拉框的选中值,所以弹出的还是之前选项对应的提示。我们需要先修改选中值,再触发事件。
修改后的完整代码如下:
// 按钮点击事件 $('#b1').on('click', function(){ // 先将下拉框选中值设置为2 $('#select_item').val('2'); // 再触发change事件 $('#select_item').trigger('change'); }); // 下拉框change事件 $('#select_item').on('change', function(){ var jbyr = $(this).find('option:selected').val(); if(jbyr == 1){ alert('Option 1'); } else if(jbyr == 2){ alert('Option 2'); } else{ alert('Option 3'); } });
关键说明:
- 先调用
val('2')设置下拉框的选中值,这一步会同步更新下拉框的显示状态; - 再调用
trigger('change')手动触发change事件,这样就能触发你写的事件处理逻辑,弹出对应的"Option 2"提示框。
如果之后需要切换到其他选项,只需要把val('2')里的参数改成对应选项的value值就可以了。
内容的提问来源于stack exchange,提问作者Shota




