Question

我遇到了问题。我试着做的是每次点击ID为#add_new_row的按钮时都要创建一个新的TR。 click事件添加一行，其中包含CLASS p_pocet的输入。在任何点击之前，我在每个页面加载时生成第一个TR，所以我调用函数countPolozky（）来给输入必要的BLUR函数。问题是这样的： 1）在第一页加载时，我点击页面上的唯一一个输入，我得到警告，我点击的行的输入正确值。 2）我点击一个按钮后添加一个新行。 jquery添加一个新行并再次调用函数countPolozky（）。（如果我不调用它，BLUR函数只对第一个TR的输入作出反应）。如果我点击新TR的输入，在我结束焦点后，我再次得到正确的警报，但如果我点击第一个TR，我得到2个警告。我只想要一个警报来获取我点击的活动行的值。如果我添加其他行，警报只会成倍增加。

     ( function($) {
        $(document).ready(function() {

                    $("#add_new_row").click(function(){
                      var pocet = parseInt($("#tbl_rows_count").attr('value')) + 1;
                      $("#tbl_rows_count").val(pocet);
                      $("#add_new_row").before('<tr></td><td><input name="pocet[]" id="pocet'+                    pocet +'" class="polozky p_pocet" type="text" value="1.0"></td></tr>');
                      $(".add_news2").click(function(){
                          $(this).parents('tr').remove();
                      });
                      countPolozky();
                    });
                    countPolozky();
       });
    } ) 
( jQuery );

     function countPolozky()    
        {
            //$(".polozky").die("blur");
            $(".polozky").blur(function() {
                pocet = $(this).closest('tr').find('.p_pocet').val();
                alert(pocet);
            });    
        }

你可以在这里看到问题，它是一个发票的网站在表单的末尾有添加ITEMS的输入，这是问题所在。 http://www.vzor-faktury.cz/#vygenerovat-fakturu

Answer 1

您有几个选择：

创建新元素时，只将新事件处理程序绑定到新元素，而不是所有.polozky。
使用事件委派。

事件委托允许您在容器对象（例如，表元素）上设置单个事件处理程序，该处理程序将处理表中所有.polozky元素的所有模糊事件。因此，您可以动态添加/修改/删除所需的所有.polozky元素，而无需绑定新的事件处理程序。

有一些帖子谈论event delegation您可以作为参考。

点击事件中的jquery调用函数会导致函数的多次调用

1 个答案: