팝업에서 jQuery 클릭이 작동하지 않습니다.

Question

코딩 파일 A와 B에 정확히 일치하는 두 개의 파일이 있습니다. 파일 A에는 파일 B의 팝업을 만드는 링크가 있습니다. 파일 A의 맨 위에는 클릭하면 사용자에게 경고하는 링크 (a href)가 생성되었습니다.

$('#send-email').click(function(e) { 
     alert('works'); 
    }); 

호기심 것은, 그들은 모두 같은 연결되어이 정확한 코드는 아니지만 파일 B.

<a href="#" id="send-email">Send Email</a> 

을 그리고 jQuery를, 그것은 파일 A에서 작동 파일 B.에 외부 jQuery 파일 및이 팝업 클릭을 제외한 다른 모든 jQuery 함수 (예 : 아코디언 메뉴)가 작동합니다. 먼저 jQueryUI를 사용해 보았습니다.하지만이 문제를 발견 한 방법입니다. 그런 다음 나는 barebones click-alert으로 내려 갔고 그 코드는 위에 게시되었습니다.

.click은 팝업에서 작동합니까? 그렇다면 어떻게?

Answer 1

팝업을 (세션 상태와 특정 브라우저의 컨텍스트에 대해 이야기 할 때를 제외하고는 여기를 제외하고는) 다른 페이지와 크게 다르지 않습니다. click은 팝업 창에서 다른 창과 동일한 방식으로 작동합니다. 문제를 일으킬 수있는 많은 것들이 있습니다.

을 대신의 방법으로 그것을 당신을 클릭 이벤트를 부착 : 아이디의 누락/맞춤법이 틀린 기능 등

그래서 나는 아직 당신에게 확실한 대답을 줄 수는 없지만, 여기에 좋은 단계를 디버깅 할 수있어 중복 그래도 문제가 해결되지 않으면

<a href="#" onclick = "alert('works')" id="send-email">Send Email</a> 

, 어쩌면 당신이 팝업을 차단하고 '그 일을 다시, 이런 식으로 그것을 (당신의 방법이 훨씬 더 정확한 내 방식보다하지만, 디버깅에 내 방식의 보조가 있습니다) - 뭔가 또는 뭔가. 경고에 문제가 있습니다. 이 작업을 수행하는 경우,이 시도 :이와

<a href="#" onclick = "AlertIt()" id="send-email">Send Email</a> 

을 다른 페이지에 :

function AlertIt() { 
alert("worked"); 
} 

를이 너무 작동하는 경우, 당신은 가능성이 jQuery를 또는 jQuery를 충돌을로드하는 데 문제보고보다 더있어 .

편집 : 오, 한 가지 더. jQuery의 live 함수를 사용해보십시오. 이미 존재하는지 여부에 관계없이 요소에 이벤트 처리기를 연결합니다. click은 요소가 이미있는 경우에만 이벤트를 첨부합니다. 이것이 작동 순서, 말하자면 사용중인 순서에 의해 발생할 수 있습니다.

live은 다음과 같습니다

$("#send-email").live("click", function(){ alert("Worked"); }); 

Answer 2

팝업과 관련하여 어떤 의미입니까? 그것은 jQueryUI 대화를 의미합니까? 그렇다면 마크 업은 자바 스크립트 코드를로드 할 때 존재합니까?

당신은 당신이 jQuery를 사용하는 경우 .on를 사용 1.7+하고 그냥로드 또는 AJAX와 dyanmic에로드 할 때 두 페이지에 모든 #send-email에 위임 할 수있는 :

$(function() { 
    $(document).on("click", "#send-email", function(e) { 
     alert('works'); 
     e.preventDefault(); 
    }); 
}); 

Answer 3

가 @voigtan에 동의합니다. 동적 내용에 대한 이벤트 처리기 할당은 까다로울 수 있습니다.

문서 준비 처리기에서 이벤트를 바인드하는 경우 이벤트 핸들러가 팝업의 내용에 대해 바인드되지 않은 경우 일 수 있습니다.

1. 팝업 내용이 표시된 후 콜백을 가지고 있고, 새로운 요소 요소가 균일 한 이벤트 핸들러가있는 경우, 그를 할당

2. 에 대한 이벤트를 바인딩 : 당신이 돌볼 수있는 방법은 두 가지가 있습니다 이 클래스는 선택 자로 사용되어 jQuery :: live() 호출로 이벤트를 첨부 할 수 있습니다.

   <a href="#" class="send-email">Send Email</a> 
   
   $(function() { 
       $(document).on("click", "a.send-email", function(e) { 
        alert('works'); 
        e.preventDefault(); 
       }); 
   });