오늘 나는 여러 제출을 방지하는 JQ의 두 번 클릭 이벤트 문제에 대해 글을 쓰고 있습니다. 이는 함수를 통해 일괄적으로 정의할 수 있으므로 메서드를 통해 요소의 이벤트를 더욱 다양하고 동적으로 바인딩할 수 있습니다. 그리고 함수 이름이나 여러 매개변수를 동적으로 전달할 수 있습니다(이 예에서는 함수 이름만 전달하고 Eval을 통해 호출합니다).
우리 모두는 jQuery의 이벤트 바인딩에서 두 번 클릭 이벤트(dblclick)가 실행될 때 두 개의 클릭 이벤트(click)가 트리거될 수 있다는 것을 알고 있습니다. 즉, div 등의 label 요소가 클릭 이벤트(click)와 더블클릭 이벤트(dblclick)에 모두 바인딩된 경우, 클릭 이벤트(click)가 실행되면 더블 클릭 이벤트(dblclick)는 트리거되지 않으며, 더블 클릭 이벤트(dblclick)는 두 개의 클릭 이벤트(클릭)를 트리거합니다.
먼저 클릭 이벤트의 실행 순서를 살펴보세요.
클릭(click): mousedown, mouseout, click
더블 클릭(dblclick): mousedown, mouseout, click, mousedown , mouseout , click, dblclick;
더블 클릭 이벤트(dblclick)에서는 두 개의 클릭 이벤트(클릭) 중 첫 번째 클릭 이벤트(클릭)는 차단되지만 두 번째 클릭 이벤트는 차단되지 않습니다. 회의. 즉, 더블 클릭 이벤트(dblclick)는 클릭 이벤트(click)의 결과와 더블 클릭 이벤트(dblclick)의 결과를 반환합니다. 두 번 클릭 이벤트(dblclick)의 결과와 두 번의 클릭 이벤트(click)의 결과 대신.
이런 경우에는 추가 클릭 이벤트(클릭)만 없애주시면 문제가 해결됩니다.
효과는 다음과 같습니다.
http://images.cnitblog.com/i/554071/201404/010846579687197.png
소스코드는 다음과 같습니다.