Javascript Jquery自定义事件到其他文档不';行不通 请考虑这个测试:
主文件:Javascript Jquery自定义事件到其他文档不';行不通 请考虑这个测试:,javascript,jquery,javascript-events,Javascript,Jquery,Javascript Events,主文件: <html> <head> <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script> <script> var secondwindow = false; $(function() { secondwindow
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>
<script>
var secondwindow = false;
$(function() {
secondwindow = window.open("secondwindow.html");
$(secondwindow).load(function() {
secondwindow.setWindow(window);
})
$("#custom").click(function() {
$(document).trigger("custom");
});
});
</script>
</head>
<body>
<button id="click">Click event</button>
<button id="custom">Custom event</button>
</body>
</html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>
<script>
var mainwindow = false;
function setWindow(obj) {
mainwindow = obj;
$(mainwindow.document).on("click", function() {
$("body").append("<p>Click event from main window</p>");
});
$(mainwindow.document).on("custom", function() {
$("body").append("<p>Custom event from main window</p>");
});
};
</script>
</head>
<body>
</body>
</html>
var secondwindow=false;
$(函数(){
secondwindow=window.open(“secondwindow.html”);
$(第二个窗口)。加载(函数(){
设置窗口(窗口);
})
$(“#自定义”)。单击(函数(){
$(文档).trigger(“自定义”);
});
});
点击事件
自定义事件
第二个(弹出)文件:
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>
<script>
var secondwindow = false;
$(function() {
secondwindow = window.open("secondwindow.html");
$(secondwindow).load(function() {
secondwindow.setWindow(window);
})
$("#custom").click(function() {
$(document).trigger("custom");
});
});
</script>
</head>
<body>
<button id="click">Click event</button>
<button id="custom">Custom event</button>
</body>
</html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>
<script>
var mainwindow = false;
function setWindow(obj) {
mainwindow = obj;
$(mainwindow.document).on("click", function() {
$("body").append("<p>Click event from main window</p>");
});
$(mainwindow.document).on("custom", function() {
$("body").append("<p>Custom event from main window</p>");
});
};
</script>
</head>
<body>
</body>
</html>
var main window=false;
函数设置窗口(obj){
主窗口=obj;
$(mainwindow.document)。在(“单击”,函数()上){
$(“body”).append(“单击主窗口中的事件””;
});
$(mainwindow.document).on(“自定义”,函数(){
$(“body”).append(“来自主窗口的自定义事件””;
});
};
我的目标是在第二个窗口中为主窗口中的自定义事件添加一个事件侦听器
我发现,而且这个测试可以证明,事件侦听其他窗口适用于“标准”事件,如单击,而不适用于自定义事件
你能告诉我这是jquery限制还是我遗漏了什么吗
(很抱歉,我无法将该代码放在JSFIDLE中,因为window.open与JSFIDLE不太兼容)问题是,您需要考虑用于定义目标和触发器的jQuery实例
secondwindow.html -> $(mainwindow.document)
不一样
main.html -> $(document)
它需要:
secondwindow.html -> mainwindow.$(mainwindow.document)
或将其反转:
main.html -> secondwindow.$(document)
secondwindow.html -> $(mainwindow.document)
jQuery事件由jQuery.event对象管理,它与正在使用的jQuery实例相关联。例如,您可以通过以下方式获取注册的事件:
$.event.global
您将看到,注册的事件不仅依赖于选择器本身,还依赖于jQuery实例。单击事件和自定义事件都是如此。mainwindow.$(mainwindow.document).on(…)起作用!非常感谢。