如何通过JQuery触发JS native even addEventListener(“change”，function)

wnvonmuf 于 2023-04-11 发布在 jQuery

关注(0)|答案(2)|浏览(188)

这不是How to trigger jQuery change event in code的重复，因为How to trigger jQuery change event in code处理的是jQuery与jQuery事件侦听器的交互，而这个问题讨论的是jQuery与native事件侦听器的交互。*

我使用addEventListener绑定了一个input的change事件，但是**$（'#input'）.瓦尔（'bbbb'）.change（）;**无法触发alert，如何通过JQuery触发addEventListener（“change”，function）函数

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <title>code</title>
</head>

<body>
    <script src="http://o6flfbzth.bkt.clouddn.com/jquery-1.12.0.min.js"></script>

    <input id="input" type="text" value="input" />
    <script type="text/javascript">
        document.getElementById("input").addEventListener("change", function() {
        alert(this.value);
    });
    </script>

    <input type="button" value="change input" onclick="  $('#input').val('bbbb').change();" />
</body>

</html>

jquery

来源：https://stackoverflow.com/questions/37113525/how-to-trigger-js-native-even-addeventlistenerchange-function-by-jquery

2条答案

按热度按时间

mfpqipee1#

您不能使用jQuery的.trigger('change')触发本机事件。
您需要ceate a native event和dispatch it：

const evt = new Event("HTMLEvents");

然后再发射：

const el = document.getElementById("input");
el.dispatchEvent(evt);

已弃用：

您需要create a native event和dispatch it：

var evt = document.createEvent('HTMLEvents');
evt.initEvent('change', true, true);
//            ^         ^     ^
//            |         |     cancelable
//            |         bubbles
//            type

然后再发射：

var el = document.getElementById("input");
el.dispatchEvent(evt);

赞(0）回复(0）举报 2023-04-11

qoefvg9y2#

使用jquery绑定change事件。

$("#input").change(function() {
  alert(this.value);
});

工作片段：

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <title>code</title>
</head>

<body>
    <script src="http://o6flfbzth.bkt.clouddn.com/jquery-1.12.0.min.js"></script>

    <input id="input" type="text" value="input" />
    <script type="text/javascript">
      $( "#input" ).change(function() {
        alert(this.value);
      });
    </script>

    <input type="button" value="change input" onclick="  $('#input').val('bbbb').change();" />
</body>

</html>

赞(0）回复(0）举报 2023-04-11

我来回答

如何通过JQuery触发JS native even addEventListener(“change”，function)

2条答案

相关问题

热门标签

最新问答