Jquery обнаруживает изменение или keyup для тега body в iframe - PullRequest
Новая
       20

Jquery обнаруживает изменение или keyup для тега body в iframe

6 голосов
/ 08 марта 2012

У меня есть элемент управления редактором контента jwysiwyg на моей странице. Элемент управления работает, создавая себя в iframe, который содержит полный HTML-код страницы.

Я хочу определить, был ли change или keyup, чтобы я мог использовать наш код "указать, что запись должна быть сохранена". У нас есть поля ввода, и это отлично работает, просто этот сторонний редакторский редактор доставляет нам проблемы.

Вот как выглядит источник страницы: 

<div id="this_is_our_div_Container">
    <div class="wysiwyg">
        <iframe id="f_Body-wysiwyg-iframe">
            <html>
            <body style="margin: 0;" class="wysiwyg">
                I just typed this now!</body></html>
        </iframe>
    </div>
    <textarea class="wysiwyg" cols="20" id="f_Body" name="f_Body" rows="2" 
        style="display: none;"></textarea>
</div>

Обратите внимание, что тег body содержит изменения в реальном времени.

С этими вопросами ...

jQuery 'if .change () или .keyup ()'

https://stackoverflow.com/a/1639342/511438

Я попробовал следующее в документе. Готов: 

$('iframe').contents().find('body.wysiwyg').live('change', function (e)
{
    alert('testing');
});
$('iframe').contents().find('body.wysiwyg').live('keyup', function (e)
{
    alert('testing');
});
$('iframe > *').bind('keyup', function (e)
{
    alert('testing');
});

Надеюсь, этот экран поможет. БОЛЬШИЙ enter image description here

Ответы [ 3 ]

7 голосов
/ 12 марта 2012

Вы, кажется, идете по правильному пути.

Интересно, сработает ли это для вас: 

$('elementSelector', $('iframeSelector').contents()).on('keyup', function(e) {
    alert('testing');
});

Так что в вашем случае я полагаю: 

$('body.wysiwyg', $('iframe#f_Body-wysiwyg-iframe').contents()).on('keyup', function(e) {
        alert('testing');
});

Хотя использование кода в этом ответе зависит от использования версии 1.7 или выше jQuery .

Если вы используете более старую версию jQuery, вы можете использовать live , которая устарела с версии 1.7, или, возможно, делегировать. Я не слишком уверен. Лучше всего использовать последнюю версию jQuery с .on () и .off ().

1 голос
/ 12 марта 2012

Я не уверен, что у вас есть доступ для редактирования внутреннего содержимого iframe, но у меня возникла похожая проблема, и это помогло мне:

Внутри тела iframe: 

$(document).ready(function(){
    $("body").live('keyup', function(){
        window.top.window.iChanged();
    })
});

В содержании родительской HTML-страницы: 

function iChanged(){
    alert("I changed");
}
0 голосов
/ 07 октября 2018

У меня есть ответ, который не использует Jquery.Если кто-то вроде меня ищет это, я думаю, что это поможет 

document.getElementById("iframe_id").contentWindow.document.body.onkeyup=function(event) {
            console.log(event.target.innerHTML);
};

Вот как я это сделал.Надеюсь, это кому-нибудь поможет.

Также вы можете увидеть - Добавление обработчика событий в iframe для вызова по keyup

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...