javascript 多次将事件绑定到jQuery中的元素是否会产生连锁React？

c9qzyr3d 于 2022-12-02 发布在 Java

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

如果我有下面的代码，那么如果多次按下新的serial按钮，serial类的文本框将多次绑定到事件。
这会影响性能吗？或者即使多次调用bind方法，jQuery也只注册一次事件吗？

$(document).ready(function () {

    MonitorSerialTextBoxes();

    $('#newSerial').click(function () {

       $.tmpl("productTemplate", mymodel).insertAfter($(".entry").last());
       MonitorSerialTextBoxes();

    });

    function MonitorSerialTextBoxes() {
      $('.serial').each(function () {
         // Save current value of element
         $(this).data('oldVal', $(this).val());
         
         // Look for changes in the value
         $(this).bind("propertychange keyup input paste", function (event) {
         
         // If value has changed...
         if ($(this).data('oldVal') != $(this).val() && $(this).val().length == 10) {
             
             // Updated stored value
             $(this).data('oldVal', $(this).val());
             
             // Do action
         }
      });
    }

});

更新：我相信它会这样做，将下面的代码添加到MonitorSerialTextBoxes函数中是否可以修复这些问题？

$('.serial').unbind("propertychange keyup input paste");

在jQuery文档中：

如果注册了多个处理程序，则它们将始终按绑定的顺序执行 *

JavaScript

来源：https://stackoverflow.com/questions/8356296/does-binding-events-to-elements-in-jquery-multiple-times-have-a-knock-on-effect

2条答案

按热度按时间

jdzmm42g1#

您可以将多个事件处理程序绑定到一个元素。下面的代码将生成一个包含两个onclick事件的按钮：

$("button").bind("click", myhandler);
$("button").bind("click", myhandler);

一种选择是首先解除事件绑定：

$("button").unbind("click").bind("click", myhandler);
$("button").unbind("click").bind("click", myhandler);

这将只产生一个绑定的单击事件。
如果因为表单动态添加了元素而要重新绑定事件，则可能需要查看live()或新的on()，它们可以将事件绑定到可能还不存在的元素。例如：

$("button").live("click", myhandler); // All buttons (now and in 
                                      // the future) have this handler.

在Webkit开发者工具（Safari和Chrome）中，你可以通过检查元素，然后在元素面板的右窗格中向下滚动来查看哪些事件绑定到了元素。它位于一个名为“Event Listeners”的可折叠框下。Firebug应该有类似的功能。

赞(0）回复(0）举报 2022-12-02

q5lcpyga2#

我认为这会导致大量的开销和一些问题，因为这些事件不止一次绑定。http://jsfiddle.net/nicolapeluchetti/syvDu/

<button id='newSerial'>Button</button>
<div class='serial'>Serial</div>
<div class='serial'>Serial</div>
<div class='serial'>Serial</div>

MonitorSerialTextBoxes();

$('#newSerial').click(function() {
    MonitorSerialTextBoxes();

});

function MonitorSerialTextBoxes() {
    $('.serial').each(function() {

        // Look for changes in the value
        $(this).bind("click", function(event) {
            alert("hi");
        });
    });
}

加载页面时，单击div时会显示一个警告，但每次按下按钮时都会显示一个警告，因为附加了一个新事件

赞(0）回复(0）举报 2022-12-02

我来回答

javascript 多次将事件绑定到jQuery中的元素是否会产生连锁React？

2条答案

相关问题

热门标签

最新问答