如何防止JavaScript上的双重绑定

How can I prevent double binding on JavaScript?

本文关键字：绑定 何防止 JavaScript      更新时间：2023-09-26

这是我的情况，我有一个可以动态添加/删除行的表，当页面加载时，我需要绑定删除行。

这是我的代码：

 <script type="text/javascript">
 $(document).ready(function(){ 
 $(".btnRemoveRow").bind("click", removeRow); });
 </script>

但当我在外部js 上添加行时，我还需要绑定另一个removeRow

function addRow(){ 
{--add row code here--}
$(".btnRemoveRow").bind("click", removeRow); 
}

以便新添加的行也将与removeRow函数绑定

这是我的removeRow函数：

function removeRow(){
var row = $(this).closest('tr');
var selected = row.find('input.qty,input.price,textarea,select').val();
$.getScript("calculate.js", function(){});
if(selected)
{
var r=confirm("Confirm Remove?");
if (r==true)
{
  row.find('input.qty,input.price,textarea,select').attr("disabled", true);
  row.find('input.hidden-deleted-id').val("yes");
  row.find('.subtotal>center>h3').text("0");
  calculate();
  row.hide();
  return false;
}
else
{
  return false;
} 
}
else{
  row.find('input.qty,input.price,textarea,select').attr("disabled", true);
  row.find('input.hidden-deleted-id').val("yes");
  row.find('.subtotal>center>h3').text("0");
  calculate();
  row.hide();
  return false; 
  }
  };

情况1：当我删除行而不首先添加任何行时，它工作正常（对话框只显示一次）。

情况2：当我先添加行，然后删除已经绑定在页面上的行时，对话框会出现两次。

情况3：当我删除我添加的行时，它运行良好（对话框出现一次）。

（附言：仍在学习JavaScript）

你知道我该怎么解决第二个案子吗？

添加一个委托的事件处理程序，这样它将适用于现有元素和未来的元素

<script type="text/javascript">
 $(document).ready(function(){ 
     $(document).on("click", ".btnRemoveRow", removeRow); 
 });
</script>

用最接近的非动态父元素替换CCD_ 1。

试试这个：

<script type="text/javascript">
 $(function(){ 
   $(".btnRemoveRow").click(function(){removeRow();});
 });
 </script>
相关文章：