触发事件

我有一个目标网站，其中有下面的下拉菜单。触发事件

<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

回答

相关问题