2017-01-24 14 views
4

私はプロジェクトでこの問題を抱えていますので、私はこれをフィドルで試しました。私はselectmenuの選択を動的にトリガーしようとしています。手動で選択した後に選択メニューの初期化内で定義したselectイベントが発生するのはなぜですか?jQuery UI selectmenu:なぜ "select"イベントがトリガされないのですか?

$("#myselect").on("selectmenuselect")を実行するとこれが可能ですが、なぜ機能しないのですかas suggested by the API?このような

$(function() { 
 
    $("#myselect").selectmenu({ 
 
     select: function() { 
 
      alert("ok"); 
 
     } 
 
    }); 
 
    setTimeout(function() { 
 
     $("#myselect").val("option4"); 
 
     $("#myselect").selectmenu("refresh"); 
 
     $("#myselect").trigger("selectmenuselect"); 
 
    }, 1000); 
 
})
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<link href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/themes/smoothness/jquery-ui.css" rel="stylesheet"/> 
 
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js"></script> 
 

 
<select id="myselect"> 
 
    <option value="option1" selected>option 1</option> 
 
    <option value="option2">option 2</option> 
 
    <option value="option3">option 3</option> 
 
    <option value="option4">option 4</option> 
 
</select>

答えて

1

何かがトリックを行う必要があります。

$(function() {  
 
    
 
    $("#myselect").selectmenu().on("selectmenuselect", function (event, ui) { 
 
     console.log(ui); 
 
    }); 
 
    
 
    setTimeout(function() { 
 
     $("#myselect").val("option4"); 
 
     $("#myselect").selectmenu("refresh"); 
 
     $("#myselect").trigger("selectmenuselect",$("#myselect")); 
 
    }, 1000); 
 
})
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<link href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/themes/smoothness/jquery-ui.css" rel="stylesheet"/> 
 
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js"></script> 
 

 
<select id="myselect"> 
 
    <option value="option1" selected>option 1</option> 
 
    <option value="option2">option 2</option> 
 
    <option value="option3">option 3</option> 
 
    <option value="option4">option 4</option> 
 
</select>

は良い一日を!

+0

まあ、これはこれまでに動作することがわかりました。私は私のプロジェクトでそれを使用すると思います。しかし、一方で、なぜ上記は機能しませんか? – elementzero23

+0

更新された質問 – elementzero23

+1

を表示するには、uiパラメータを取得する必要がある場合は、トリガー機能(更新されたスニペット)に送信する必要があります –

関連する問題