jQuery 函数绑定在“输入属性更改”上，未按预期触发

jQuery function bind on 'input propertychange' not firing as expected

本文关键字：绑定 函数 输入 属性 jQuery      更新时间：2023-09-26

我有jQuery代码调用一个函数：

$('#text_area').bind('input propertychange', function() {...

绑定到函数的元素是一个文本区域。当我键入并删除文本时，该函数被调用得很好，但是当我通过热键或拖动鼠标选择所有文本，然后点击退格键时，不会调用该函数。这是我无法调用函数的唯一实例。'input propertychange'事件是否预期如此？如果是这样，我该如何更改它以按预期工作？请注意，这适用于Chrome，IE和Firefox。

这符合你的目的吗？

$('#text_area').on('keyup', function() {
    console.log('called');
});

小提琴：http://jsfiddle.net/KyleMuir/ruJZD/

此外，从 jQuery 1.7 开始，.on() （http://api.jquery.com/on/） 是绑定事件的首选方式。

编辑：由于有人在右键单击粘贴文本之后，这是一个更新：

$('#text_area').on('keyup paste', function() {
    console.log('called');
});

小提琴：http://jsfiddle.net/KyleMuir/ruJZD/9/

您需要在

清除文本区域时调用函数。或者，您希望在将文本粘贴到文本区域时调用相同的函数。

您可以使用与问题中包含的代码相同的代码。我在这个答案中包含一个工作演示 

 <textarea id='textarea1'>data</textarea>
//.......

.......

$("textarea").bind('input propertychange', function(){
  alert($(this).val());
});

注意：使用 jquery 插件

演示

如果要防止同时触发，请使用以下代码

<textarea id="textarea"></textarea>
/

/.......

var text = "";
$("#textarea").on("change keyup paste", function() {
    var Val = $(this).val();
    if(Val == text) {
        return; //prevent multiple simultaneous triggers
    }
    text = Val;
    alert("changed!");
});

演示1

'Note: Checked with chrome and firefox'
.

bind 方法已被弃用最新的 3 j 查询版本。相反，我们可以使用 .on in 来获得正确答案。

 <textarea id="anytextid"></textarea>
<div id="sethere"></div>

此更改的正确文本

$('#anytextid').on('input propertychange', function() {
    $('#sethere').html($(this).val().length );
});
相关文章：