클릭 이벤트의 누적 귀속, 클릭 한 번, 여러 번 실행

최근에 업무상 클릭 이벤트가 누적되는 문제에 부딪혔다. 요소에 클릭 이벤트 효과를 추가하지만 항상 효과가 실패한다. 마지막으로 클릭 이벤트가 여러 차례 실행된 것을 발견했다. 인터넷에서 찾아봤는데 다음은 이 문제를 해결하는 몇 가지 사고방식이다.

 $("#adsCollection_tb .contentDel").on("click",function(){
    $(this).each(function(){
    var obj_address_name = $(this).parent().parent().find(".obj_address_name").html();
    var jsonDel = {
            "head": {
            　　"module": "object",
           　　 "function": "del_obj"
             },
             "body":[
                   {
           　　 "name": obj_address_name
                    }
              ]
           }
         alert(" ？");
         addrGroup.Ajax(jsonDel);
                         
 　　 });
 });

페이지에서 원소 귀속 이벤트입니다. 이벤트가 실행된 후에 페이지가 리셋되지 않고 원소가 남아 있습니다. 그리고 다시 클릭하면 원소는 한 번의 클릭 이벤트로 귀속됩니다. 이렇게 하면 두 번의 클릭으로 두 번 실행됩니다.어떻게 누적 귀속을 해결합니까?

첫 번째 방법

원소를 클릭하면 삭제하고 원소를 동적으로 만들고 클릭 이벤트를 추가합니다.분명히 이 방식은 매우 번거롭다.

두 번째 방법

jquery의one() 방법을 사용하여 원소에 일회용 이벤트 처리 함수를 연결합니다. 이 이벤트 처리 함수는 한 번만 실행됩니다.

$("#adsCollection_tb").one("click",function(){
    alert(" "); 
})

세 번째 방법

매번 귀속 클릭 이벤트 전에 이전의 이벤트 귀속을 해제하고 요소 귀속 이벤트를 하는 것은 먼저 비우고 조작하는 것과 같다.그러나bind () 방법으로 귀속할 때, unbind () 방법으로 귀속을 해제할 수 있습니다.일반적으로 우리는 온 () 방법으로 이벤트를 연결합니다. bind () 방법이 추천되지 않기 때문에 오프 () 방법으로 이벤트 연결을 해제합니다.

$("#adsCollection_tb").unbind("click").bind("click",function(){
   alert(" "); 
});
$("#adsCollection_tb").off("click").on("click",function(){
   alert(" "); 
})；

본인은 이런 방법을 통해 이 문제를 해결하였으며, 같은 문제에 부딪힌 사람을 도울 수 있기를 희망합니다

https://github.com/zhangqian00/

이것은 저의 github 주소입니다. 제가 쓴 리퀴어, angular, vue 등에 관한 작은 프로젝트가 있습니다. 최근에 Nodejs를 공부하고 있습니다. 큰 소들이 가르쳐 주고 교류하며 나누는 것을 매우 환영합니다.

위챗 공중번호 검색: 앞부분이 바쁩니다.
더 많은 일을 나누고, 오신 것을 환영합니다!