jquery 이벤트 실행 감지 code_jquery

이틀 전에 도시 검색을 할 때 검색 버튼에 이벤트를 바인딩했습니다. 입력 필드의 텍스트가 요구 사항을 충족하지 않으면 레이블 프롬프트를 사용합니다(라벨이 표시된 후 문서에 클릭을 바인딩하고 숨깁니다.) 클릭 후 라벨)을 입력하고 해당 열에 포커스를 맞춥니다. 이런 작은 기능을 3시간 넘게 디버깅했는데, 나중에 버튼 클릭 이벤트와 입력이 번갈아 발생하는 현상이 발생한 것으로 추정됩니다. PreventDefault() 및 stopPropagation() 함수를 추가한 후 수정되었습니다. 문제는 해결되었지만 이벤트의 실행 순서는 정말 마스터하기 어렵기 때문에 페이지 이벤트 트리거를 자동으로 기록할 수 있는 간단한 이벤트 모니터링 기능을 만들었습니다. 다음 코드를 참조하세요(jquery가 먼저 도입되어야 합니다!...)

코드 복사 코드는 다음과 같습니다.

//이벤트 실행 모니터링
function eventsMonitor( op){
var defaultSetting = {
eventsStr: "click focus Blur",
splitStr: " ",
css:{
"border":"1px red solid",
"z -index":9000000,
"배경":"흰색",
"위치":"절대",
너비:400,
높이:200,
"오버플로 -x":"숨김",
"overflow-y":"auto"
}
};
var ops = $.extend(true,defaultSetting,op);
$ ('< ;div id="DivForLogEvents">

').appendTo("body").css(ops.css)
var $infolog = $ ("# DivForLogEvents div:eq(0)");
$.each(ops.eventsStr.split(ops.splitStr),function(i,v){
if(v != 'resize')
$("*:not('#DivForLogEvents')").bind(v, function(e){
if(!$(e.target).is("#DivForLogEvents") && !$ (e. target).is($infolog)){
$infolog.append((e.target.nodeName||" ") "->" (e.target.id||e.target.Name ||" ") " " v " 이벤트!
")
$("#DivForLogEvents:not(:animated)").animate({scrollTop:$infolog.height()},300) ;
}
});
else
$(window).bind('resize', function(e){
if(!$(e.target).is(" #DivForLogEvents" ) && !$(e.target).is($infolog)){
$infolog.append((e.target.nodeName||" ") "->" (e.target.id ||e .target.Name||" ") " " v " event!
")
$("#DivForLogEvents:not(:animated)").animate({scrollTop:$infolog. height() },300);
}
});
})
}

호출 방법 예

코드 복사 코드는 다음과 같습니다.

< ;head>