iframe에 대한 jQuery Force set src 속성

83

나는 내부에 iframe이있는 메인 페이지 (실제로 JSP)가 있습니다.

<iframe name="abc_frame" id="abc_frame" src="about:blank" frameborder="0" scrolling="no"></iframe>

이제 기본 페이지 (JSP를 통해 동적으로 렌더링 됨)에 여러 링크가있어 src를 일부 URL로 설정할 수 있습니다.

이제 내 질문은 jQuery (live () 일 수 있음)를 사용하여 abc_frame의 "src"속성이 항상 특정 값 (예 : "somefixedURL")을 갖도록 재정의 할 수 있는가입니다.

일부 Java 코드를 통해 완전히 동적으로 생성되어 iframe src를 재정의하려고하므로 링크 클릭을 캡처 할 수 없습니다.

javascript jquery dom

— testndtv
소스

166

속성 사용

$('#abc_frame').attr('src', url)

이렇게하면 모든 HTML 태그 속성을 가져오고 설정할 수 있습니다. 또한 .prop(). 차이점에 대해서는 .prop () 대 .attr ()을 참조하십시오 . 짧은 버전 : .attr()HTML 소스 코드로 작성된 속성에 사용 .prop()되며 DOM 요소에 첨부 된 모든 JavaScript에 사용됩니다.

— PiTheNumber
소스

이 것없는 작품은 페이지가로드 된 후, 또 다른 링크가 새 값으로 SRC를 바꿀 것입니다 이유는 ...

— testndtv

파일 끝에서 코드를 요청하면 다른 스크립트 다음에 코드가 실행됩니다. 사용자가 클릭 한 특정 링크에 의해 문제가 발생한 경우 두 번째 onclick 이벤트를 링크에 추가 할 수 있습니다. 그렇지 않으면 setTimout / setInterval을 사용하고 src 값을 반복적으로 확인해야합니다 (추악!).

— PiTheNumber

20

jQuery 1.6 이상을 사용 하는 경우 대신 .prop () 를 사용하고 싶습니다..attr():

$('#abc_frame').prop('src', url)

차이점에 대한 설명은 이 질문 을 참조하십시오 .

— Kalyfe
소스

4

흥미로운 링크이지만 jQuery가 동작을 되돌 렸기 때문에 답변이 업데이트되었습니다 attr(). 링크 된 API 문서에서 설명 하는 것처럼 속성이 속성이 아니기 .prop()때문에 전반적으로 여기서 사용하는 데 동의하지 src않습니다 .prop().

— PiTheNumber 2013

9

링크를 생성하는 동안 대상을 iframes 이름 속성으로 설정하면 jquery를 전혀 다룰 필요가 없을 것입니다.

<a href="inventory.aspx" target="contentframe"  title="Title Inventory">
<iframe id="iframe1" name="contentframe"  ></iframe>

— 브라이언 리조
소스

가능하면 브라우저의 기본 방법을 사용하는 것이 좋지만 사용자에게 동적 링크가 있으므로 클릭 속성을 캡처해야합니다.

— efwjames 2014

얼마나 역동적입니까? 페이지를 생성 할 때 href를 필요한 것으로 설정하십시오. 또는 dom로드에서도 필요한 경우 href 속성을 설정하십시오. 요점은 iframe의 src 속성을 처리 할 필요가 없다는 것입니다.

— Brian Rizo 2014-04-07

8

$(document).ready(function() {
    $('#abc_frame').attr('src',url);
})

— Jayendra
소스

5

src 속성 설정이 작동하지 않았습니다. iframe에 URL이 표시되지 않았습니다.

나를 위해 일한 것은 다음과 같습니다.

window.open(url, "nameof_iframe");

누군가에게 도움이되기를 바랍니다.

— 하리
소스

.attr () 설정도 저에게 효과적이지 않았습니다. 그래도 작동합니다

— Andy N

3

<script type="text/javascript">
  document.write(
    "<iframe id='myframe' src='http://www.example.com/" + 
    window.location.search + "' height='100' width='100%' >"
  ) 
</script>

이 코드는 iframe이 포함 된 페이지에서 URL 매개 변수 (? a = 1 & b = 2)를 가져 와서 iframe의 기본 URL에 연결합니다. 내 목적을 위해 작동합니다.

— Arend
소스

document.write사용과 동일합니다 eval(). 스크립트 삽입이 적용됩니다! 극도로주의해서 만 사용하십시오!

— amphetamachine

1

FIX iframe의 src를 설정하거나 위치를 변경하기 위해 javascript / form 제출을 방지 할 수 없습니다. 그러나 당신이하는 스크립트를 넣을 수 있습니다 온로드 각 동적 링크의 페이지 변경 조치.

— 얀 파이퍼
소스

1

$(".excel").click(function () {
    var t = $(this).closest(".tblGrid").attr("id");
    window.frames["Iframe" + t].document.location.href = pagename + "?tbl=" + t;
});

이것은 내가 사용하는 것이므로 jquery가 필요하지 않습니다. 이 특정 시나리오에서 엑셀 내보내기 아이콘이있는 각 테이블에 대한이 특정 시나리오에서는 해당 테이블에 연결된 iframe이 페이지가 찾는 쿼리 문자열의 변수를 사용하여 동일한 페이지를로드하도록 강제하고 응답이 발견되면 mimetype을 엑셀하고 해당 테이블에 대한 데이터를 포함합니다.

— vernmic
소스