jQuery.change（）與addEventListener不兼容？

我在使用純Javascript與jQuery混合使用時遇到了這個問題（我使用的是兩個不同的庫）。因此，對於文本輸入字段，純JavaScript腳本依賴於使用addEventListener方法添加的更改事件綁定。另一個jQuery插件（datetimepicker）用於更改該字段，並在更新值後觸發jQuery.change（）方法。jQuery.change（）與addEventListener不兼容？

問題是，偵聽器沒有被jQuery事件觸發。下面是一些簡單的代碼來說明問題。

<!DOCTYPE html> 
<html> 
<body> 
<input id="abc">abc abc.</input> 
<script src="//ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
<script> 
document.getElementById('abc').addEventListener("change", function(){ 
    alert('change event triggered'); 
}); 
$('#abc').change(); 
</script> 
</body> 
</html>

鑑於這樣的非常簡單的HTML頁面，事件偵聽器實際上不會被jQuery.change（）方法被觸發，所以警報框將不會顯示。如果我手動更改輸入字段，則該事件正常工作。

跟進：如果使用jQuery進行事件綁定和觸發，沒有問題。問題是，我正在使用一個用純JavaScript編寫的庫（JSONEditor [https://github.com/jdorn/json-editor]）），並且使用Javascript API添加事件綁定，並且我正在使用的其他庫更改了某些輸入字段並使用jQuery觸發了該事件，並且該事件未被捕獲。

來源

2014-12-02 Jason Huang

javascript不是圖書館。 jQuery是一個JavaScript庫。 – 2014-12-02 06:18:09

爲什麼你不能使用jQuery事件處理程序 – 2014-12-02 06:19:48

此代碼工作正常，沒有jQuery。小提琴http://jsfiddle.net/qw2z22m9/ – Aditya 2014-12-02 06:20:24

使用trigger() jQuery中

$('#abc').on("change", function(){ 
    alert('change event triggered'); 
}).trigger("change");

來源

2014-12-02 06:17:44 Balachandran

我只是想了解爲什麼jQuery觸發事件不能被監聽器捕獲。肯定有一些解決方法。 – 2014-12-03 09:23:19

嘗試內document.ready()包裝jQuery的代碼，並使用簡單的jQuery事件處理程序用於此目的，如下所示： -

<script> 
$(document).ready(function(){ 
    $('#abc').on('change',function(){ 
    alert("here"); 
    }).change(); // trigger `.change()` event on page load. 
}); 
</script>

或者，如果你要動態生成HTML用Jquery，然後嘗試事件代表團： -

<script> 
$(document).ready(function(){ 
    $(document.body).on('change','#abc',function(){ 
     alert("here"); 
    }).change(); // trigger `.change()` event on page load. 
}); 
</script>

來源

2014-12-02 06:17:51

不幸的是，由於JSONEditor（[https://github.com/jdorn/json-editor]）添加了事件綁定，我無法輕鬆使用jquery事件處理程序。 – 2014-12-03 09:22:14

@JasonHuang ...上述鏈接無法正常工作.. .try我的第二個答案.. – 2014-12-03 09:33:36

對不起，我想我沒有把問題弄清楚。問題是如何觸發jQuery中addEventListener方法添加的監聽器。 – 2014-12-04 05:04:53

jQuery.change（）與addEventListener不兼容？

回答

相關問題