将事件绑定到iframe的内容并从iframe触发它

Question

我从当前的项目中发现了一个非常奇怪的错误：

index.html（演示）和iframe.html

做的：

1）点击第一个输入并选择任何日期

你会看到 - “在iframe中更改了datepicker！”

2）点击第二个输入，写下一些符号并按下页面上的任意空格

你会看到 - “在iframe中改变了normal_input！” +“normal_input在iframe外面改变了！”

内部iframe：

<input id="datepicker" /> <input id="usual_input" />

在index.html处绑定到此输入处的更改事件：

$(this).contents().find("#datepicker").change(... (1)
$(this).contents().find("#usual_input").change(... (2)

将iframe.html绑定到此输入处的更改事件：

$("#datepicker").change(... (3)
$("#usual_input").change(... (4)

但№1不能在任何浏览器中使用！

jquery ui的datepicker 100％正确触发更改事件。为什么我们不能绑定它外面一个iframe？

Answer 1

您可以通过以下方式访问iframe的window元素：

$(this)[0].contentWindow.$("#datepicker")

或者可能也可以工作：

this.contentWindow.$("#datepicker");

我希望有所帮助。

Answer 2

非常有力的结论：

有 2个jquery对象：main_ $和iframe _ $

main_ $可以控制iframe _ $

iframe_ $无法控制主_ $

iframe_ $无法触发事件到主_ $

。

主要_ $（IFRAME）.contents（）发现（ “元件”）结合（ “事件”）。将无效

只有标准（输入，选择和textarea）的浏览器发出的事件可以随处抓取

JCOC611 找到的最佳解决方案是用iframe替换临时main_ $ _ $

var main_$ = $;
$ = $(iframe).get(0).contentWindow.$;
//many logick which works perfectly without iframes
$ = current_$;

你当然可以独立使用main_ $和iframe_ $

PS

不记得世界上最糟糕的浏览器中的旧jquery错误 - 即

$("...").find("iframe").ready(
    function() {
        //this == iframe.contentDocument
        this.contentWindow == undefined;
    }
);

仅按特定路径获取iframe的窗口

$("...").find("iframe").get(0).contentWindow

它跨浏览器工作！ ：3