ajax로드 된 페이지에서 JQuery 액션 수행

jquery.load를 사용하여 div에로드 한 html 파일의 내용에 액세스하려고합니다.ajax로드 된 페이지에서 JQuery 액션 수행

내 인덱스 페이지는 다음과 같습니다

<!DOCTYPE html> 
    <html> 
    <head> 
     <title> 
     </title> 
     <script src="jquery.js" type="text/javascript"></script> 
     <script src="script.js" type="text/javascript"></script> 
     <link rel="stylesheet" type="text/css" href="style.css"> 
    </head> 
    <body> 
     <div id="content"> 
     </div> 
    </body> 
</html>

내 스크립트는 지금까지 다음과 같습니다

$(document).ready(function() { 
    $("#content").load("content.html"); 
    $("#content").click(function(){ 
     alert($(this).attr("id")); 
    }); 
});

content.html 페이지 :

<!DOCTYPE html> 
<html > 
    <head> 
     <title></title> 
    </head> 
    <body> 
     <h1 id="header1"> 
     Content 
     </h1> 
     <p> 
      This is a paragraph 
     </p> 
     <p> 
      This is another paragraph 
     </p> 
    </body> 
</html>

그래서 내가 원하는 일어날 일은 다음과 같습니다 : 콘텐츠 div에서 태그를 클릭하면 해당 태그의 ID가 표시됩니다 - 즉 "head er1 "이지만 현재는"content "만 표시합니다. 이것을 어떻게 할 수 있습니까?

고맙습니다.

출처

2013-06-12 Morne

콘텐츠의 모든 요소에 이벤트 처리기를 바인딩합니다.

$(document).ready(function() { 
    $("#content").load("content.html"); 
    $("#content, #content *").click(function(e){ 
     alert(this.id); 
     e.stopPropagation(); 
    }); 
});

또는하자 이벤트가 전달 될 :

$(document).ready(function() { 
    $("#content").load("content.html"); 
    $("#content").click(function(e){ 
     alert(e.target.id); //may return undefined if no id is assigned. 
    }); 
});

작업 예를 :http://jsfiddle.net/5JmsP/

출처

2013-06-12 08:57:46

감사를 많이, 완벽하게 작동합니다! – Morne

@Morne 우수합니다. 기꺼이 도와 드리겠습니다! –

ajax로드 된 페이지에서 JQuery 액션 수행

답변

관련 문제