You need to enable JavaScript to run this app.
最新活动
大模型
产品
解决方案
定价
生态与合作
支持与服务
开发者
了解我们

如何在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

火山引擎 最新活动