gpt4 book ai didi

jquery - 从 iFrame 内部绑定(bind)到父级时,避免在 Jquery 中重复绑定(bind)

转载 作者:行者123 更新时间:2023-12-01 04:55:04 25 4
gpt4 key购买 nike

我有一个棘手的情况 - 任何帮助将不胜感激。

我的 iframe 中有一个父页面和一个子页面。这是示例 html:

对于父页面:

<html>
<body>
<a id="banana">Banana</a>

<iframe src="ChildPage.html" />
</body>
</html>

然后是 ChildPage.html:

<html>
<body>
<form>
<input type="submit" value="Submit" />
</form>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js"></script>
<script>
$('#banana', top.document).click(function() {
alert('hello world');
});
</script>
</body>
</html>

观察单击提交按钮时会发生什么 - 单击处理程序两次绑定(bind)到 Banana 链接,并出现两个警报对话框。

在这种情况下,防止多重绑定(bind)的常用技术不起作用:

// This doesn't work either
var clickHandler = function() {
alert('hello world');
};

$('#banana', top.document).unbind(clickHandler).bind(clickHandler);

这是因为当我们提交 iframe 时,clickHandler 被视为一个新对象,与之前的 clickHandler 不同。

有趣的是,命名空间也不起作用 - 命名空间上下文似乎位于创建命名空间的窗口内,而不是绑定(bind)到它所绑定(bind)的元素。

// This still doesn't work either
$('#banana', top.document)
.unbind('click.myns')
.bind('click.myns', function() {
alert('hello world');
});

最佳答案

您可以向尝试将事件绑定(bind)到的元素添加一个属性,然后在事件绑定(bind)上检查该属性。

$("#banana:not(.initialized)", top.document).bind();

我通常在处理动态创建的内容(例如模式和 iframe)时这样做,以保存状态,并避免可怕的双重绑定(bind)困惑。

关于jquery - 从 iFrame 内部绑定(bind)到父级时,避免在 Jquery 中重复绑定(bind),我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/14975035/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com