jQuery的設置由.VAL選擇選項（）不會觸發（ '變化'，）

Question

JS Fiddle

<select id="panel" > 
    <option value=1>One</option> 
    <option value=2>Two</option> 
    <option value=3>Three</option> 
</select> 
<button id="button">Click me</button> <br> 

$('#button').click(function(){ 
    $('#panel').val(3); 
}); 
$('#panel').on('change',function(){ 
    alert('Hi'); 
}); 

是否有人知道如何讓這些東西的作品？

Answer 1

另外你可以使用.trigger()：

說明：執行附加爲 匹配元素的所有處理程序和行爲給定的事件類型。

$('#button').click(function() { 
 
    $('#panel').val(3).trigger("change"); 
 
}); 
 
$('#panel').on('change', function() { 
 
    alert('Hi'); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<select id="panel"> 
 
    <option value=1>One</option> 
 
    <option value=2>Two</option> 
 
    <option value=3>Three</option> 
 
</select> 
 
<button id="button">Click me</button> 
 
<!--click will change the select. But it doesnt fire the on change function. -->

Answer 2

您需要手動觸發事件，

$('#panel').val(3).change(); 

Fiddle

Answer 3

在你的情況下，它不會觸發更改事件，這是任務，你必須調用樣改變事件。更改如下
你必須使用像 HTML：

<select class="panel" > 
                        <option value="1">One</option> 
    <option value="2">Two</option> 
    <option value="3">Three</option> 
                       </select> 
<button id="button">Click me</button> <!--click will change the select. But it doesnt fire the on change function. --> 

JQUERY：因爲它們的設計

$('#button').click(function(){ 
    $('.panel').val(3); 
    $(".panel").change(); 
}); 
$(".panel").change(function() { 
    alert("Handler for .change() called."); 
});