jquery iframe выборщик тела - PullRequest
       1

jquery iframe выборщик тела

10 голосов
/ 10 февраля 2011

есть простое выражение для доступа к телу iframe с помощью jquery. Предположим, что идентификатор iframe - theframe.

Я хочу передать обработчик событий в iframe. например,

$("#theframe").contents().find("body").click(function() {
    alert("hello, you touched me~");
});

но этот код не работает в IE.

любая альтернативная идея помоги мне ~

1 Ответ

18 голосов
/ 10 февраля 2011

Дайте свойство name для элемента iframe. Теперь вы можете ссылаться на это так:

window.name_of_iframe

Ваш iframe может не иметь jQuery, поэтому использование стандартного обхода является более безопасным способом

iframe_body = window.name_of_iframe.document.getElementsByTagName("body")[0];

Это будет элемент body в iframe. Это, однако, может быть использовано jQuery на странице хоста, поэтому:

$(window.name_of_iframe.document.getElementsByTagName("body")[0]);

- это ваша jQuery-оболочка для элемента body iframe.

Будьте внимательны, только если загружен iframe:

$("iframe[name=name_of_iframe]").load(function() {
    var iframe_body = window.name_of_iframe.document.getElementsByTagName("body")[0];
    $(iframe_body).click(function() {
        alert("hello, you touched me~");
    });
});

ОБНОВЛЕНИЕ: протестировал его в IE, и с ним довольно странное поведение. В Firefox вы должны обернуть его в событие готовности документа, но в IE оно должно быть снаружи, сразу после элемента iframe. Эта версия также работает в IE и Firefox.

<iframe name="ifr" src="?if=1"></iframe>
<script type="text/javascript">
var ifr_loaded = false;
$("iframe").load(function() {
    $(window.ifr.document.getElementsByTagName("body")[0]).click(function() { alert("s"); });
    ifr_loaded = true;
});
$(function() {
    if (!ifr_loaded)
    {
        $("iframe").load(function() {
            $(window.ifr.document.getElementsByTagName("body")[0]).click(function() { alert("d"); });
        });
    }
});
</script>

ОБНОВЛЕНИЕ 2: более короткая версия, но у нее есть недостаток, заключающийся в том, что вы должны указать источник iframe в javascript, но он работает во всех браузерах, которые я пробовал.

<iframe name="ifr"></iframe>
<script type="text/javascript">
$(function() {
    $("iframe").load(function() {
        $(window.ifr.document.getElementsByTagName("body")[0]).click(function() { alert("d"); });
    }).attr("src","/teszt/v/index.php?if=1");
});
</script>

ОБНОВЛЕНИЕ 3: И еще более простой способ для конца:

<script type="text/javascript">
function init_iframe(obj) {
    $(obj.document.getElementsByTagName("body")[0]).click(function() { alert("d"); });
}
</script>
<iframe name="ifr" src="?if=1" onload="init_iframe(window.ifr);"></iframe>
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...