jquery mobile을 추가 한 후 아이를 입니까?

Question

처음에는 빈 목록이 있습니다. 문서 준비 함수 내에서

<ul id="list" data-role="listview" data-inset="true"> 
      </ul> 

, 나는 각각의 고유 한 ID를 가진 UL에 여러

$('#list').append('<li id="a">A</li>').listview('refresh'); 

를 호출합니다. 내가

$('#list').children() 

같은 일을하려고하면 그것은 []로 빈 세트를 제공,

<ul id="list" data-role="listview" data-inset="true"> 
     <li id="a">A</li> 
     <li id="b">B</li> 
</ul> 

그러나 HTML의 body 태그의 말 : 그래서 결과는 같아야합니다. 비슷하게 클릭 이벤트를 $("#a").click(function{alert("A")})과 같이 첨부하면 동적으로 생성 된 이후 #a를 인식하지 못하므로 전혀 작동하지 않습니까?

나는 누군가가 저에게 무슨 일이 일어나고 있는지 그리고이 문제를 해결할 수있는 방법이 있는지 알려주기를 바랍니다.

Answer 1

이벤트를 다이너 믹티 추가 데이터에 바인딩하려면 jquery 라이브 함수를 사용해야합니다.이 작업을 수행하십시오.

$("#a").live('click',function(){ 
alert("A"); 
}); 

Answer 2

.children 일에 대해 모르겠다. 이상한 소리.

클릭 이벤트는 항목이 동적으로 생성 되었기 때문에 발생합니다.

이 문제를 해결하려면 각 항목에 클래스를 추가하십시오.

<li id="a" class="ListItem">A</li> 

그런 다음 각 키워드를 사용하여 목록을 반복 할 수 있습니다.

클릭 이벤트는 live 키워드를 사용합니다.

$(".ListItem").live("click", function() { your code here }) 

Answer 3

jQuery 모바일을 사용하는 경우 평소처럼 문서 준비 핸들러를 사용할 수 없습니다. 페이지는 ajax로 가져 오므로 문서 준비 처리기는 한 번만 시작됩니다 (사용자가 처음 방문한 페이지). 대신 pagecreate (events) 이벤트에 바인딩해야합니다.

다른 사람들과 마찬가지로 동적으로 추가 된 콘텐츠의 클릭 이벤트를 처리하려면 live을 사용해야합니다.

Answer 4

이 작업을 수행 할 수 있습니다 : 그것은 만드는 것

<script type="text/javascript" src="jquery-1.6.3.min.js"></script> 
<script> 
$(document).ready(function(){ 
    $('#list').append('<li id="a">A</li>') 
    .append('<li id="b">B</li>') 
    .append('<li id="c">C</li>'); 
}); 
</script> 
<ul id="list" data-role="listview" data-inset="true"></ul> 
<script> 
setTimeout(function(){ 
    $('#list').children("li").each(function(){ 
     alert($(this).attr("id")); 
    }); 
},100); 
</script> 

에서는 setTimeout는 당신이뿐만 아니라 준비 문서 내부의 이벤트 연결 코드를 삽입 할 필요가