Javascript jquery:anchor类多次单击激发

Javascript jquery:anchor类多次单击激发,javascript,jquery,html,onclick,Javascript,Jquery,Html,Onclick,我不熟悉jquery。我希望在单击锚时克隆一个具有新id的div。但是当我单击锚元素时,div被克隆了多次 代码: html html+='<li><a data-role="button" class="km-widget km-button cls-delete" type="button" id="'+del_id+'" ><span class="km-text">delete</span></a>&nbsp;&

我不熟悉jquery。我希望在单击锚时克隆一个具有新id的div。但是当我单击锚元素时,div被克隆了多次

代码:

html

html+='<li><a data-role="button" class="km-widget km-button cls-delete" type="button" id="'+del_id+'" ><span class="km-text">delete</span></a>&nbsp;&nbsp;<a data-role="button" class="km-widget km-button cls-copy" type="button" id="'+copy_id+'"><span class="km-text">copy</span></a>&nbsp;&nbsp;<a data-role="button" class="km-widget km-button cls-edit" type="button" id="'+edit_id+'"><span class="km-text">edit</span></a></li>';
html+='
  • 删除复制编辑
  • ';
    我哪里做错了?如何解决此问题?

    找到了解决方案:

       $(document).ready(function(){
    
            $("a.cls-copy").unbind('click').bind("click", function(event){
               alert("test");
               event.stopPropagation();
               div_id = $(this).closest('div').attr('id');
               var newdiv = $("#"+div_id).clone(true).attr('id',"newQuestionsDiv-Page"+countPage+"-"+questionCount).insertAfter("#"+div_id);
               console.log("newdiv : "+$(newdiv).attr('id'));
               if($(newdiv).find(".questiondata").length != 0)
               {
               $(newdiv).find(".questiondata").val("");
               }
    
               e_id = "edit"+countPage+"-"+questionCount;
               var temp_id= $(newdiv).attr('id');
    
               d_id = "del"+countPage+"-"+questionCount;
               c_id = "copy"+countPage+"-"+questionCount;
               questionCount++;
    
               showSuccessToast("Your question is copied");
               $("#"+temp_id).find(".cls-edit").attr('id',e_id);
               $("#"+temp_id).find(".cls-delete").attr('id',d_id);
               $("#"+temp_id).find(".cls-copy").attr('id',c_id);
    
               });
         });
      Replace your code with above code and check how much time test alerts ..
    
     $(document).off("click","a.cls-copy").on("click", "a.cls-copy", function(event){
                   event.stopPropagation();
                   div_id = $(this).closest('div').attr('id');
                   var newdiv = $("#"+div_id).clone(true).attr('id',"newQuestionsDiv-Page"+countPage+"-"+questionCount).insertAfter("#"+div_id);
                   console.log("newdiv : "+$(newdiv).attr('id'));
                   if($(newdiv).find(".questiondata").length != 0)
                   {
                   $(newdiv).find(".questiondata").val("");
                   }
    
                   e_id = "edit"+countPage+"-"+questionCount;
                   var temp_id= $(newdiv).attr('id');
    
                   d_id = "del"+countPage+"-"+questionCount;
                   c_id = "copy"+countPage+"-"+questionCount;
                   questionCount++;
    
                   showSuccessToast("Your question is copied");
                   $("#"+temp_id).find(".cls-edit").attr('id',e_id);
                   $("#"+temp_id).find(".cls-delete").attr('id',d_id);
                   $("#"+temp_id).find(".cls-copy").attr('id',c_id);
    
                   });
    
    有了这个代码

    1) .on-您可以向DOM中添加元素,但仍可以处理单击事件

    2) .off-删除事件处理程序


    请参阅

    它可以正常工作,但对我来说不行。如果我向DOM树动态添加更多元素,那么这将不起作用。如何解决此问题?用on和test替换bind
     $(document).off("click","a.cls-copy").on("click", "a.cls-copy", function(event){
                   event.stopPropagation();
                   div_id = $(this).closest('div').attr('id');
                   var newdiv = $("#"+div_id).clone(true).attr('id',"newQuestionsDiv-Page"+countPage+"-"+questionCount).insertAfter("#"+div_id);
                   console.log("newdiv : "+$(newdiv).attr('id'));
                   if($(newdiv).find(".questiondata").length != 0)
                   {
                   $(newdiv).find(".questiondata").val("");
                   }
    
                   e_id = "edit"+countPage+"-"+questionCount;
                   var temp_id= $(newdiv).attr('id');
    
                   d_id = "del"+countPage+"-"+questionCount;
                   c_id = "copy"+countPage+"-"+questionCount;
                   questionCount++;
    
                   showSuccessToast("Your question is copied");
                   $("#"+temp_id).find(".cls-edit").attr('id',e_id);
                   $("#"+temp_id).find(".cls-delete").attr('id',d_id);
                   $("#"+temp_id).find(".cls-copy").attr('id',c_id);
    
                   });