jQuery 单击事件在 Mozilla 中不起作用（在 Chrome 中起作用）

Question

我知道之前有人在这里问过这个问题，因为我记得当我第一次尝试在我的个人网站上重新创建这种效果时阅读了关于这个主题的各种帖子。话虽这么说，但这次我一辈子都找不到那些帖子。我应该救他们 >:/

所以，对于重复的内容，我深表歉意，但我正在尝试做其中一件 "click anywhere BUT here to close element overlay" 事情。在 Chrome 中表现出色，但在 Mozilla 中表现不佳。最重要的是，我使用它的其他元素都运行良好（在 Mozilla 和 Chrome 中），只是这个不是。

jQuery

function closeProductOverlay() {
    if (!$(event.target).closest('#clickControl').length) {
        $('#productOverlay').toggle('fast', 'linear');
    }
}

HTML

<div id="productOverlay" style="display:none;" onclick="closeProductOverlay()">
    <div id="mobiPadding">
        <div id="productContainer">
            <div id="clickControl">
                <!-- This is where I populate items dynamically -->
            </div>
        </div>
    </div>
</div>

正如我所说，我已将此概念应用于同一 project/website 中的许多功能，并且它们都完美无缺。我无能为力试图诊断这一点。

我尝试了一些乱七八糟的 "fixes,"，但其中 none 的功能符合预期。我得到的最接近的是 if 像这样删除 if 语句：

jQuery

function closeProductOverlay() {
    $('#productOverlay').toggle('fast', 'linear');
}

但是，很明显，如果您单击“任意位置”，叠加层就会消失。（即使您正在单击按钮或试图复制文本）。这很烦人，而且不能按我的需要工作。

Answer 1

event 在 Firefox 中不像在 IE 或 Chrome.

中那样是全局的

一个解决方案是更改您的函数以将事件传递给它：

function closeProductOverlay(event) {

并更改绑定：

<div id="productOverlay" style="display:none;" onclick="closeProductOverlay(event)">

jQuery 单击事件在 Mozilla 中不起作用（在 Chrome 中起作用）

jQuery Click Event Not Working in Mozilla (Working in Chrome)

html

jquery

mozilla

google-chrome