Подтвердить что ты не робот

Изменение источника iframe с помощью jquery

Я пробовал это немного и посмотрел на другие ответы на подобные вопросы по SO, но когда я пытаюсь изменить атрибут src iframe, он обновляет его для всего окна. Вот следующий код, который я использую, который работает правильно (без jquery):

<html>
<head>
<style type="text/css">
iframe#ifrm { 
    border:none;
    padding:.5em;
    margin:1.5em 0 1em;
    width:100%;
    height:100%;
}
</style>
<script src="./js/jquery-1.4.2.js" type="text/javascript"></script>
<script type="text/javascript">
// <![CDATA[
    // !!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!
    // this is the function I'm trying to replace:
    function loadIframe(iframeName, url) {
    if ( window.frames[iframeName] ) {
        window.frames[iframeName].location = url;   
        return false;
    }
    return true;
}
// ]]>
</script>
</head>

<body>
<ul>
<li><a href="#" onclick="location.href='http://www.google.com/'; return false;" onclick="return loadIframe('ifrm', this.href)">Page 1</a> </li>
<li><a href="tabs.html" onclick="return loadIframe('ifrm', this.href)">Page 2</a></li>
</ul>
<div class="iframe">
<iframe name="ifrm" id="ifrm" src="tabs.html" frameborder="0">
Your browser doesn't support iframes.</iframe>

Как я уже сказал, я пробовал

$('#ifrm').attr('src', "http://www.google.com")

который отображает страницу, но не в iframe. Я действительно просто изучаю jquery, но я не могу понять, что отличается от моей ситуации, чем другие подобные вопросы:

Обновление JQuery и iFrame

Спасибо.

4b9b3361

Ответ 1

Должен работать.

Вот рабочий пример:

http://jsfiddle.net/rhpNc/

function loadIframe(iframeName, url) {
    var $iframe = $('#' + iframeName);
    if ( $iframe.length ) {
        $iframe.attr('src',url);   
        return false;
    }
    return true;
}

Ответ 2

Использование attr(), указывающее на внешний домен, может вызвать такую ​​ошибку в Chrome: "Отказ отображать документ, потому что отображение запрещено с помощью X-Frame-Options". Обходной путь к этому может заключаться в том, чтобы переместить весь код HTML iframe в script (например, используя .html() в jQuery).

Пример:

var divMapLoaded = false;
$("#container").scroll(function() {
    if ((!divMapLoaded) && ($("#map").position().left <= $("#map").width())) {
    $("#map-iframe").html("<iframe id=\"map-iframe\" " +
        "width=\"100%\" height=\"100%\" frameborder=\"0\" scrolling=\"no\" " +
        "marginheight=\"0\" marginwidth=\"0\" " +
        "src=\"http://www.google.it/maps?t=m&amp;cid=0x3e589d98063177ab&amp;ie=UTF8&amp;iwloc=A&amp;brcurrent=5,0,1&amp;ll=41.123115,16.853177&amp;spn=0.005617,0.009943&amp;output=embed\"" +
        "></iframe>");
    divMapLoaded = true;
}