2015-10-26 124 views
1

我知道这已经在此处提出过了,因为我记得当我第一次试图在我的个人网站上重新创建这个效果时,阅读了有关此主题的各种帖子。话虽如此,这次我无法为我的生活找到这些帖子。我应该保存它们::/jQuery Click事件在Mozilla中不起作用(在Chrome中工作)

所以,我为重复道歉,但我试图做一个“点击任何地方,但在这里关闭元素覆盖”的东西。在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> 

正如我已经说过了,我申请这个概念的许多功能在整个同一个项目/网站,他们都工作得很好。我正在努力诊断这件事。

我已经尝试了一些凌乱的“修补程序”,但它们中的任何一个都没有按照预期方式运行。我已经得到的最接近的是,如果去掉if语句,像这样:

jQuery的

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

不过,很显然,如果你点击任何地方,覆盖消失。 (即使你点击按钮,或试图复制文字)。这非常烦人,并且不能按我的需要工作。

回答

2

event在Firefox和IE或Chrome中都不是全局的。

一种解决办法是改变你的函数将事件传递到它:

function closeProductOverlay(event) { 

,并更改绑定:

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

那么这肯定做到了!多么容易,谢谢! – perkface

相关问题