JQuery绑定('点击')到多个选择器不起作用

时间:2013-08-29 19:22:26

标签: jquery jquery-ui iframe jquery-selectors

请参阅以下更新

这是我的代码:

$(document).on('click', '#btnClose, .ui-dialog-titlebar-close', function () {
    alert('test');
});

当我点击#btnClose,而不是右上角的 jQuery UI 关闭按钮时,它会触发。

我也试过翻过来,得到相同的结果。

$(document).on('click', '.ui-dialog-titlebar-close, #btnClose', function () {});

以下是jQuery UI关闭按钮的HTML:

<button class="ui-button ui-widget ui-state-default ui-corner-all ui-button-icon-only ui-dialog-titlebar-close" role="button" aria-disabled="false" title="close">
    <span class="ui-button-icon-primary ui-icon ui-icon-close"></span>
    <span class="ui-button-text">close</span>
</button>

更新该按钮位于iframe中。这一定是问题所在。有创意吗?

以下是我目前的情况:

       function closeDialog() {
           alert('Closing');
               //this works fine
       }

       $(document).on('click', '#btnClose', function () {
           closeDialog()
               //this never fires
       });

       window.parent.$(document).on('click', '.ui-dialog-titlebar-close', function () {
           closeDialog();
       });

第二个不能正常工作。请记住,脚本是iFrame的一部分,因此需要从父级访问选择器。奇怪的是我正在使用window.parent。$()来做其他事情没有问题。

4 个答案:

答案 0 :(得分:1)

这很疯狂,但确实有效。

$('#btnClose').add(parent.$('.ui-dialog-titlebar-close')).on('click', function () {
    closeDialog();
});

答案 1 :(得分:0)

原始代码中缺少结束圆括号。 JS对括号非常敏感。如果缺少括号并且您的代码不起作用,则调用将不正确。 我修改了你的代码:

$(document).on('click', '#btnClose, .ui-dialog-titlebar-close', function () {
    alert('test');
});

同样适用于第二位代码:

$(document).on('click', '.ui-dialog-titlebar-close, #btnClose', function () {}
);

在这两种情况下,.on函数有三个参数:两个字符串和回调函数。

这可能是复制/粘贴错误,但很容易成为问题的“原因”。

答案 2 :(得分:0)

如果iframe的内容不在同一个域中,则您无法以任何方式与$(document)的内容进行互动。 (有postMessage,但这是另一个话题。)

如果iframe来自同一个域,则很容易,而不是:

$("#iframeID").contents()

使用

{{1}}。

答案 3 :(得分:0)

您可能正在处理same-origin policy。安全策略将防止使用来自其他站点或协议的元素进行修改。