아약스 응답으로 얻는 버튼 ID를 표시하고 싶습니다.
이 코드 줄을 사용하여 버튼을 쉬게합니다.
<script language="JavaScript">
var XMLHttpRequestObject=false;
if(window.XMLHttpRequest){
XMLHttpRequestObject = new XMLHttpRequest();
}else if(window.ActiveXObject){
XMLHttpRequestObject = new ActiveXObject("Microsoft.XMLHttp");
}
function getData(){
var district_id = 'D01';
var queryString = "?district_id=" + district_id ;
XMLHttpRequestObject.onreadystatechange = function(){
if(XMLHttpRequestObject.readyState == 4 && XMLHttpRequestObject.status == 200){
var container = document.getElementById('issues');
var response = XMLHttpRequestObject.responseText;
container.innerHTML = response;
}
}
XMLHttpRequestObject.open("GET", "complaints.php"+queryString ,true);
XMLHttpRequestObject.send(null);
}
</script>
<div id="issues">
</div>
<?php
$district_id = $_GET['district_id'];
echo '<button id="'.$district_id.'">'.$district_id.'</button>';
?>
이제 내 문제는 버튼 ID가 동적으로 필요하다는 것입니다.
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
getData();
$("button").click(function(){
var id = $(this).attr("id");
alert(id);
});
});
</script>
버튼은 AJAX 응답에서 동적으로 생성되므로 그 당시에는 DOM에 존재하지 않기 때문에 클릭 이벤트를 버튼 온로드에 직접 연결할 수 없습니다.
이벤트 위임을 사용 하고 이벤트를 document. 즉 .on,에 전달 된 선택기가 모든 클릭을 확인 하므로 모든 클릭 이벤트가 표시되고 함수에서 처리됩니다 (선택기와 일치하는 경우).
$(document).on('click', 'button', function(){
var id = $(this).attr("id");
alert(id);
});
이 기사는 인터넷에서 수집됩니다. 재 인쇄 할 때 출처를 알려주십시오.
침해가 발생한 경우 연락 주시기 바랍니다[email protected] 삭제
몇 마디 만하겠습니다