집 > 기사 > 웹 프론트엔드 > 동적으로 생성된 요소를 가져오는 jQuery example_jquery

동적으로 생성된 요소를 가져오는 jQuery example_jquery

WBOY원래의: 2016-05-16 16:44:331666검색

요구 사항 설명: 테이블 등 페이지에 데이터를 동적으로 추가할 수 있으며, 버튼을 클릭하면 행을 동적으로 추가할 수 있습니다. 또는
페이지가 로드되면 Ajax를 통해 백그라운드에서 테이블 데이터를 가져옵니다. 이제 우리는 값 중 하나를 얻고 싶습니다. 어떻게 얻을 수 있습니까?

클릭, 마우스오버 등의 이벤트를 통해 획득하고 싶다면 live() 메소드를 이용하시면 됩니다

코드복사 코드는 다음과 같습니다:

 
$(".button").live("click",function(){ 
console.info($( "#mytd") .html()) 
}) 

이벤트를 통하지 않으면 페이지가 로드될 때 값을 얻거나 다른 작업을 수행해야 합니다

live( ) 메소드는 이벤트를 전달할 수 없기 때문에 작동하지 않습니다.

예를 들어 다음 코드는

코드 복사 코드는 다음과 같습니다.

< 본문>

;
< script type="text/javascript">
$(function() {
$.post("admin/UserForumthemeBabygrowupFrontList.do",{},function(data) >console.info(data .table);
$("#tab").append(data.table)
})

alert($("#mytd").html ()); // 값 가져오기
});

위 코드는 매우 간단합니다. post를 통해 백그라운드에서 반환된 값을 추가하는 것입니다. to
백그라운드에서 반환된 데이터는 그리고 게시물 이후에 mytd로 ID를 가져오려고 합니다. 현재

값을 가져올 수 없습니다. 브라우저에서

문제를 확인할 수 있습니다. 경고가 발생했을 때 데이터를 사용할 수 없음을 알 수 있습니다. 로딩 후 콘솔은 정보를 인쇄하지 않으므로 현재 데이터를 얻을 수 없습니다. 동적으로 생성된 요소를 가져오는 jQuery example_jquery

요청이 완료되면 실행할 코드를 ajaxComplete() 메소드를 사용하여 다음과 같이 수정했습니다.

코드 복사 코드는 다음과 같습니다:

$(function() {

$.post("admin/UserForumthemeBabygrowupFrontList.do",{},function(data) { 
console.info(data.table); 
$("#tab").append(data.table) 
}) 
$("#tab").ajaxComplete(함수 (){ //요청 대기 중 완료되면 
alert($("#mytd").html()) 
}) 
}); 🎜> 
이때 페이지를 가져올 때 이미 데이터가 로드되어 있습니다.

성명：

이전 기사：Extjs Label_extjs의 fieldLabel 및 html 속성 값을 정렬하는 방법다음 기사：Extjs Label_extjs의 fieldLabel 및 html 속성 값을 정렬하는 방법

동적으로 생성된 요소를 가져오는 jQuery example_jquery

관련 기사