jQuery选择器性能: Safari

Question

我正在构建一个菜单页面，如果用户单击任何不是菜单链接的东西，她/他就会被带回主页。这是页面：http://newsite.paulwagenblast.com/design/

div ID包装器的样式为：

<div id="wrapper" style="height: 100vh; position: fixed; top: 0; left: 0; margin: 0 auto; width: 100vw; z-index:-1;" class="hfeed">

本质上，包装器覆盖了整个页面，如果用户单击了页面中心的菜单链接以外的任何内容，我希望用户被送回主页。以下是链接的HTML：

<header class="header"> ... stuff ... <li class="menu-cloud xlarge"><a href="http://newsite.paulwagenblast.com/sample-design-page-2/">Sample Design Page 2</a></li> ... stuff ... </header>

我写的jQuery是：

jQuery(' div#wrapper:not("header") ').click(function() {
    window.location.assign("http://newsite.paulwagenblast.com/")
});

这段代码，以及其他许多选择器变体，在Firefox和Chrome上运行得很好，但在Safari上，任何点击的东西都会把用户带回主页，包括应该带你到项目页面的链接。

我相信这是因为包装器的大小可以覆盖整个页面。包装器是固定位置的，具有z-index -1，菜单项是相对定位的，z-index为1，以尝试将它们放在包装器的前面。我相信由于定位的原因，包装器总是在顶部，因为它是固定定位的。但是，即使我相对定位包装器，并将其z-index保留为-1，这也不能解决Safari中的问题。所以，我不确定这是jQuery还是Safari中的定位问题。

有没有人可以建议一下，这样当点击菜单链接时，用户不会转到这个页面：Home page

Answer 1

试一试

jQuery('div#wrapper').click(function(e) {
    if (jQuery(e.target).is(':not("header, header *")'))
       window.location.assign("http://newsite.paulwagenblast.com/")
});

如果单击的元素本身或其后代不是header，它将更改位置。