Jquery 检测 iframe 内 body 标记的更改或 keyup

标签 jquery dom iframe jquery-selectors

我有一个jwysiwyg我的页面上的内容编辑器控件。该控件的工作原理是在 iframe 中创建自身,其中包含完整的 html 页面代码。

我希望检测是否有更改keyup,以便我可以使用我们的“指示需要保存记录”代码。我们有输入框,并且工作正常,只是这个第 3 方编辑器控件给我们带来了问题。

页面源代码如下:

<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 标签包含实时变化。

带着这些SO问题...

jQuery 'if .change() or .keyup()'

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

我已在 document.Ready 中尝试了以下操作:

$('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');
});

希望这个打印屏幕能有所帮助。 LARGER enter image description here

最佳答案

您似乎走在正确的道路上。

我想知道这是否适合您:

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

所以在你的情况下我想:

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

尽管使用此答案中的代码取决于使用 version 1.7 or higher of jQuery .

如果您使用旧版本的 jQuery,则可以使用 live从 1.7 版开始,它已被弃用,或者可能是 delegate。我不太确定。您最好的选择可能是使用最新版本的 jQuery 以及 .on() 和 .off()。

关于Jquery 检测 iframe 内 body 标记的更改或 keyup,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/9614545/

相关文章:

jquery - 剑道网格 : Set focus and select all text for a Combobox template or editor

jquery - 添加 css 类在 jquery 中有时不起作用

jquery - 在 Firefox 和 IE 上使用 event.stopPropagation()

javascript - 可以在 div 中渲染 DOM 吗?

javascript - 如何只查找父页面上的对象但排除iframe下的对象

jquery - 如何在 ASP.NET MVC 中为单词着色

javascript - javascript 重定向后 css 无法正确加载

javascript - js - 通过单击图标从表中的行显示 DIV

iframe 内容被阻止

javascript - 如何从 iframe 中设置 Chrome 打印对话框的默认文件名?