觸發事件

我有一個目標網站，其中有下面的下拉菜單。觸發事件

<select class="categories-options" data-level="1" name="level1-option" id="level1-option" required=""> 
    <option value="">default</option> 
    <option value="p1" data-href="/callback/p1">P1</option> 
    <option value="p2" data-href="/callback/p2">P2</option> 
    <option value="p3" data-href="/callback/p3">P3</option> 
</select>

當一個項目從菜單中選擇，它會觸發一個「change」事件，當這個事件發生在一個函數被調用。我使用Chrome調試了該事件，當我從下拉菜單中選擇一個項目時，您可以看到調試輸出。我從調試器截圖。

現在，讓我解釋我正在嘗試做什麼。我使用JavaScript函數中使用下面的代碼從下拉菜單中的項目：

var id= document.getElementById('level1-option'); 
setSelectedValue(id, "p2"); 
$('#level1-option').trigger("select");

在最後一行中，我試圖觸發在網頁中原本會發生同樣的事件，如果我手動選擇的項目。但是，它不會觸發任何東西。 |我在調試輸出中看到事件由類觸發。我嘗試了很多不同的東西，但沒有奏效。任何人都可以解釋這個問題嗎？我怎樣才能觸發使用jQuery或JavaScript在該網頁中發生的相同事件？

Chrome debugger output

來源

2014-12-03 Dundar

您的代碼：

$('#level1-option').trigger("select");

...會觸發一個事件稱爲select（這是不相關的表單字段的值更改），但你停在事件在調試器change，不select：

enter image description here

如果您要觸發change事件，觸發事件change：

$('#level1-option').trigger("change"); 
// Difference is here -------^

邊注：由於您使用jQuery，你的代碼可以是簡單的，你不需要在getElementById或setSelectedValue：

$('#level1-option').val("p2").trigger("change");

來源

2014-12-03 11:12:21

好了，我已經嘗試過塞萊ct，改變，onChange，但他們不只是工作。你怎麼看待調試窗口中的srcElement？也許我的選擇器不正確？ – Dundar 2014-12-03 11:23:45

@Dundar：'select'事件在這裏是不相關的（它不涉及值的變化）。沒有'onChange'事件。該事件是「改變」。它看起來像你有正確的元素選擇器，並且jQuery的'trigger'確實觸發了更改事件。我建議在你的代碼上停止調試器，並確保當你試圖更新它時存在元素。 – 2014-12-03 11:44:51

試試這個

$('#level1-option').trigger("change");

來源

2014-12-03 11:13:13

感謝您的回覆。請參閱下面的評論。 – Dundar 2014-12-03 11:29:32

您可以在JQuery中的文件準備好功能添加此 '$（「＃1級選項」）上（「變」，函數（）{DO_YOUR_STUFF_HERE}）;' 這將觸發每次你改變項目在下拉列表中選擇 – 2014-12-04 06:38:44

回答

相關問題