使用.on（）但数据提交乘以

Question

在给出解决方案之前。请阅读我的第一个问题Click Here

所以我所有的第一个问题都解决了。但数据提交繁殖。例如：当我第一次点击。它提交一次。当我点击第二次。它提交两次。等等...如何解决它？很迷惑

在这里我简单的代码

$(document).on('click','.page-info',function(){ 
     $('a[href|="#status-page"]').click(function(event){ 
      //DO THE SUBMIT DATA HERE 
      event.preventDefault(); 

      //alert('testing'); 

      //href=#page-{id} 
      var n='#status-page'.length; 
      n++; 

      var href=$(this).attr('href'); 
      //pageid=get the href {id} 
      //pageid=id 
      var pageid=href.substr(n); 

      //Change status on database 
      $.get(CHANGE_STATUS+'/'+pageid); 

      //Change value status to active/disable 
      var selector='#status-page-'+pageid; 

      var status=$(this).html(); 

      if(status=='Active'){ 
       status='Disable'; 
      } 
      else 
      { 
       status='Active'; 
      } 

      //Change status 
      $(selector).html($(this).html()); 
      $(this).html(status); 

      var theStyle=(status!='Active')?'isGood':'isBad'; 
      $(selector).removeClass('isBad isGood').addClass(theStyle); // This code didn't work too :((
     }); 


    }); 

这里我简单的HTML

<tr class="page-info"> 
    <td> 
     <span class="isAction"><a href="#status-page-50">Disable</a> | <a href="#">Delete</a></span> 
     <h5><a href="#page-50">Project P</a></h5> 
     <p><strong>Project P</strong> - </p> 
    </td> 
    <td>2011-11-07 03:19:24</td> 
    <td> 
     <span class="cms_Status isBad"> 
      Disable  </span> 
    </td> 
</tr> 

在我的网页我有形式，可以用jQuery添加数据，这样做：

1. 发布数据
2. 获取数据
3. 后最后一个“第-信息” Appand数据

Answer 1

你有你的.page-info<tr>元素（一个或多个）上定义一个单击处理程序和该处理程序中添加点击处理程序<a>元素。因此，当您点击<a>其处理程序被调用，然后事件“冒泡”到包含的<tr> - 并且<tr>上的处理程序继续向<a>添加第二个点击处理程序。下次单击它时会添加第三个点击处理程序，然后是第四个点击处理程序，等等。这些多个处理程序不会相互替换，它们都保持活动状态并被一个接一个地调用。

您可以从“冒泡”，由处理程序上<a>点击添加内停止event.stopPropagation();的情况，但实际上并不会帮助不大，因为点击<tr>的其他地方仍然会触发其点击添加更多的处理程序<a>。

我不明白你为什么需要处理器.page-info<tr>摆在首位。你能解释一下吗？我的冲动，只是删除线1和5，即你的代码的第一个和最后一个行删除.page-info<tr>单击处理：

1 $(document).on('click','.page-info',function(){ // <-- delete 
2  $('a[href|="#status-page"]').click(function(event){ 
3   // many lines of your code here 
4  }); 
5 });            // <-- delete this line 

（顺便说一句，这个答案是基于所提供的信息负全部在这个问题中 - 我感到胡思乱想，不会为打算阅读一些其他问题而烦恼，以获得这个问题的背景：我该如何知道另一个问题的哪些部分适用？您应该提供所有的必要的背景在这里。）