"로그인"및 "가입"을 위해 오른쪽 상단 모서리에 일련의 가상 단추 (<a
태그가 단추처럼 꾸며져 있음)가있는 웹 사이트를 유지 관리해야했습니다. 고객은 "로그인"과 "문의하기"로 변경하려고합니다. 가입은 다른 페이지입니다.브라우저의 "개발자 도구"는 어디서/어떤 클릭 이벤트 처리기가 추가되었는지 추적 할 수 있습니까?
아무런 문제가 없으므로 쉽게 수정할 수 있다고 생각합니다. <a href="/signup"
을 <a href="/contactus"
으로 바꿨습니다. 페이지에있는 버튼을 가리키면 상태 표시 줄에 올바른 URL이 표시되지만 버튼을 클릭하면 가입 페이지로 이동합니다
이렇게 나는 nav에서 일하는 클릭 이벤트 처리기가 있다고 가정하고, 그 클릭 이벤트 코드가 무엇인지 알아 내려고 또는 어떻게 연결되었는지 알아 내려고
크롬의 검사 요소가 내게 많은 것을 말하지 않습니다. (아마도 이해할 수 없기 때문일 수 있습니다.) - 나는 "이벤트 (위의 DOM 계층 구조의 다른 항목)을 검사 한 후 "청취자"탭에 있지만, (해당 계층의 모든 DOM 요소에 대한) 동일한 이벤트 핸들러 목록이 표시되고 나에게 도움이되는 내용이 표시되지 않습니다. 실행되는 소스 코드를 결정하십시오. Chrome은 all.js
에 링크되어 있다고 말합니다. 해당 파일은 430KB의 축소 된 스크립트이므로 어떤 웹 라이브러리가 있는지 확실하지 않으므로 "line 13 in all.js"는별로 도움이되지 않습니다. li.sign-up.wide
아래의 트리에있는 항목이 클릭 이벤트 처리 코드로 돌아갈 수 있도록 도와 줄 수 있습니까?
가장자리/IE가이 브라우저에서 많은 정보 중 하나 ..이 없었, 이벤트 리스너 탭이 떨어져 li
에서 a
요소를 들고 다시 DOM 루트를 향한 요소 주로 비어있는 클릭 이벤트가 나열되어 있지만 다시 all.js 어딘가에 다시 연결됩니다. IE는 적어도 1752 행의 2 행에 있다고 말하지만, 원하는 코드라고 믿기가 어렵습니다. all.js
은 축소 된 스크립트의 대량입니다.
bind
click
을 (이벤트 바인딩 -) jquery.click (때로는 보인다 사용),
signup
(사용자가 클릭 핸들러에 의해 전송되는 URL을) 나는 유망한 보이는 몇 가지 켜져 : 확실히
var bindMiniSignup = function() {
$('#sign-up-widget .sign-up.wide, #sign-up-widget .sign-up.mobile').bind('click',function(){
Main.ExpandSignUpForm();
return false;
});
$('#sign-up-widget .log-in.wide, #sign-up-widget .log-in.mobile').bind('click',function(){
Main.ExpandLogInForm();
return false;
});
}
이 클래스와 ID 이름을 변경하려는 요소를 참조하십시오 :
이 기능 bindMiniSignup
는 다양한 장소 (예를 들어 document.ready)에 몇 번이라고 그래서 나는 그것이 내가 찾던이었다 확신했다. 아아, 기능의 본문을 주석으로 처리하여 바인딩이 만들어지지 않았으므로 사이트에 아무런 영향을 미치지 않습니다. 여전히 이전처럼 동작합니다 (새 JS가로드되었는지 확인하기 위해 캐시를 비 웠습니다).
제 질문은; 요소에 click
바인딩이있는 PHP 또는 JS 파일을 찾고 변경하는 작업을 수행 한 경우 요소를 클릭 할 때 호출되는 코드 (또는 바인딩을 수행하는 코드)를 찾는 방법은 무엇입니까? 이 버튼을 클릭 한 후 즉시 브라우저를 중단시키는 방법이 있습니까? 그렇다면 실제 클릭 핸들러 코드가 실행되고 있으므로 모든 소스 코드를 검색 할 수 있습니까?
CSS와 함께 파일 수가 적어서 "다른 형식으로 웹 리소스를 컴파일하는 것"이 JS에도 적용될 수 있다고 생각합니다. 포인터 덕분에 나는 멍청 할 것입니다. –
Ahh. .. header.htm에서 발견 된'