如何使 onChange 事件对来自数据库而不是来自用户操作 Jquery 的预选数据起作用

Question

所以我有这样的选择代码：

<select name="id_service" id="wagan" class="form-control" required="">
    <option selected="" disabled="" value="">-Pilih Cok-</option>
    <option value="1" data-yuyu="1" data-service="Berlangganan" selected="">Berlangganan</option>
    <option value="2" data-yuyu="2" data-service="One Time Charge">One Time Charge</option>
    <option value="3" data-yuyu="3" data-service="Bandwith On Demand">Bandwith On Demand</option>                                                            
</select>

有 3 个数据项选项，它们具有值 1、2 和 3。我使用以下代码将侦听器附加到该元素：

$('#wagan').change(function(){
    var dayu = $('#wagan option:selected').attr('data-yuyu');
      
        if (dayu == '1'){
            // Do something when the value is 1
        }else if(dayu == '2'){
            // Do something when the value is 2
        }else if(dayu == '3'){
            // Do something when the value is 3
        };
});

如果用户通过自己的操作选择并提交更改，则.change可以工作。 但是如果我早点设置它使用：

$("#wagan").val("2").change(function(){
    // Do something after value is set to value 2
}

它不起作用。

我在Jquery源代码中读到过：

注意：使用 JavaScript 更改输入元素的值，例如使用 .val() 不会触发该事件。

如何完成？
如何首先设置值并运行 onChange 函数？
谢谢你的帮助

Answer 1

您可以使用 trigger 自己trigger事件：

$("#wagan").val("2").trigger("change");

文档