program story

iFrame jQuery에서 요소 선택

inputbox 2020. 7. 25. 10:53
반응형

iFrame jQuery에서 요소 선택


우리의 응용 프로그램에서 우리는 웹 페이지를 구문 분석하고 iFrame의 다른 페이지에로드합니다. 로드 된 페이지의 모든 요소에는 tokenid가 있습니다. 해당 tokenid-s로 요소를 선택해야합니다. 의미-메인 페이지의 요소를 클릭하고 iFrame의 페이지에서 해당 요소를 선택합니다. jQuery의 도움으로 다음과 같은 방식으로 수행하고 있습니다.

function selectElement(token) {
     $('[tokenid=' + token + ']').addClass('border'); 
}

그러나이 기능을 사용하면 iFrame이 아닌 현재 페이지에서만 요소를 선택할 수 있습니다. 로드 된 iFrame에서 요소를 어떻게 선택할 수 있습니까?

감사.


var iframe = $('iframe'); // or some other selector to get the iframe
$('[tokenid=' + token + ']', iframe.contents()).addClass('border');

또한 src보안상의 이유로이 iframe의 도메인이 다른 도메인을 가리키는 경우 자바 스크립트에서이 iframe의 콘텐츠에 액세스 할 수 없습니다.


이 게시물을보십시오 : http://praveenbattula.blogspot.com/2009/09/access-iframe-content-using-jquery.html

$("#iframeID").contents().find("[tokenid=" + token + "]").html();

선택기를 찾기 방법에 배치하십시오.

그러나 iframe이 서버에서 나오지 않으면 가능하지 않을 수 있습니다. 다른 게시물은 권한 거부 오류에 대해 설명합니다.

jQuery / JavaScript : iframe의 내용에 액세스


문서가 준비되었다고해서 iframe도 준비되었다는 의미는 아니므로
iframe로드 이벤트를 듣고 내용에 액세스해야합니다.

$(function() {
    $("#my-iframe").bind("load",function(){
        $(this).contents().find("[tokenid=" + token + "]").html();
    });
});

사례가 콘솔 (예 : Chrome 개발자 도구)을 통해 IFrame에 액세스하는 경우 드롭 다운을 통해 DOM 요청의 컨텍스트를 선택할 수 있습니다 (그림 참조).

Chrome 개발자 도구-iFrame 선택


다음은 컨테이너에서만 div를 드래그 할 수 있도록하는 간단한 JQuery입니다.

$("#containerdiv div").draggable( {containment: "#containerdiv ", scroll: false} );

참고 URL : https://stackoverflow.com/questions/6316979/selecting-an-element-in-iframe-jquery

반응형