jQuery/Javascript-当val在浏览器控制台中更改时，检测select选项中的更改

Question

我有一个代码，当选择选项更改时会触发，但当浏览器控制台中的值更改时，它不会检测到更改事件。

$("#additional_myfield3").on('change', function(){
// recalculation of shipping cost
});

更新这是在WooCommerce中，选择选项的更改将更新运费。默认运费为0美元，但更改后将重新计算，范围从5美元到10美元不等。

• 更改控制台中的值

jQuery('select#additional_myfield3').val('Location 1');

问题是，当通过控制台更改选项时，它不会更新运输成本。在后端，TEAM被更改为"；位置1"；但运费仍然是0，而本应是5美元。

Answer 1

确保在页面加载后进行初始化，如

window.onload = function() {
$("#additional_myfield3").on('change', function(){
alert('changed');
});
}

Answer 2

$("#additional_myfield3").on('change', function() {
alert('changed');
});

//on console should trigger change
$("#additional_myfield3").val("2").trigger("change");

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<!-- on input should trigger change -->
<select id="additional_myfield3">
<option value="1">1
<option value="2">2
</select>