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

8060 단어 총결산일상 개발 구덩이 밟기

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

 $("#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를 공부하고 있습니다. 큰 소들이 가르쳐 주고 교류하며 나누는 것을 매우 환영합니다.


위챗 공중번호 검색: 앞부분이 바쁩니다.
더 많은 일을 나누고, 오신 것을 환영합니다!
제5강_eayui-pagination 페이지 구성 요소
layui 표는 과학적 계수법으로 표시하지 않는 긴 숫자를 내보냅니다.

좋은 웹페이지 즐겨찾기

개발자 우수 사이트 수집

개발자가 알아야 할 필수 사이트 100선 추천 우리는 당신을 위해 100개의 자주 사용하는 개발자 학습 사이트를 정리했습니다
best100-homepage