0

我用谷歌搜索，但似乎找不到任何 jquery；当用户点击任何地方时，它会将他们带到索引。例如，如果用户在一个项目中但想回家，他们可以点击任何地方，它会将他们带回家。

但是，当用户在主页上时，不应该应用同样的 jquery 吗？

我正在尝试实现它的网站在这里我尝试实现@jonathanchow 答案：

<script type="text/javascript">
var home = "http://www.speakingwithpictures.com";

$(body).click(
function(e)
{
  e.preventDefault();
  if (window.location.href!=home)
  {
    window.location = home;
  }
});
</script>

但它没有用。

4

4 回答 4

3

我已经修改了代码，在这里查看。我相信这就是您所需要的，或者至少非常接近它，您应该能够根据您的需要对其进行定制。

要了解发生了什么，首先您需要了解事件冒泡（或传播）是如何工作的。我们使用的是 jQuery，所以我只会解释 jQuery 是如何处理它的（顺便说一句，它几乎与大多数浏览器一样）。

当某个元素上发生事件时，将为该特定事件调用事件处理程序。但是（！）该事件还会“冒泡”DOM 树并执行附加到它在途中找到的元素的所有事件处理程序。示例小提琴在这里：

<div class="outer">
    <div class="in-the-middle">
        <div class="inner">
        </div>
    </div>
</div>

<script type="text/javascript">
    $('div').on('click', function(e) {
        alert($(this).attr('class');
    });
</script>

现在，如果你点击中间的 div，点击事件就会被调用，你会得到一个提示“in-the-middle”的提示。但是该事件会冒泡到外部 div，并找到一个附加到该事件的点击事件，因此也会弹出另一个警告说“外部”。如果点击外层，只会喊出“外层”，点击内层时，三个都会被提醒。

现在回到你的问题。我之前给出的代码（在这个小提琴中）的问题是它没有很好地处理这个原则。现在看看上面新小提琴中的代码，看看以下几行：

var target = $(e.target);
var find = target.parents('.do-not-go-to-home');

if(!target.hasClass('do-not-go-to-home') && find.length <= 0) {
    ...
}

在您看到的第一行e.target中。变量e只是事件，传递给事件处理程序。目标是事件第一次发生或触发事件的 DOM 元素。现在我正在做的是一直遍历到文档本身（从目标到它的父级，到它的父级，等等，将正文传递给文档）。当一路上找到一个具有类 '.do-not-go-to-gome' 的元素时，它会存储在 find 参数中。

现在在 if 子句中，您可以检查是否在找到此类的过程中（find.length 应该为零），或者目标本身是否具有该类。为什么？如果您单击某个具有“do-not-go-to-home”类的 div，它的父母之一可能正在执行事件处理程序。我们现在已经解决了这个问题。

唯一需要注意的是:not(.homepage)选择器中的小狙击手。这将确保事件附加到每个不属于 class 的homepagebody 元素（其中只有一个） 。所以在你的主页上，确保你的 body 标签看起来像这样<body class="homepage">：将主页与任何其他页面区分开来的其他方法当然也是可能的。

玩得开心！

原始答案
好吧，只需将点击事件附加到正文。并添加一个类或做其他事情来确定它是否是主页。做类似的事情：

$('body').on('click', function(e) {
    e.preventDefault();
    if(!$(this).hasClass('homepage')) {
        window.location.href = 'http://myhomepage.com';
    }
} );

编辑 啊哈！你的问题只是有点扩展。所以你希望用户点击任何地方回家，除了某些 div（例如你的图像）。在这种情况下，只需添加一个过滤器。

<div class="do-not-go-home">content</div>

$('body').on('click', 'div:not(.do-not-go-home)', function(){});

在这里查看小提琴：http: //jsfiddle.net/KKY4T/1/

于 2013-07-30T09:15:17.667 回答
2 
var home = "http://www.example.com/index";

$('body').click(
function(e)
{
  e.preventDefault();
  if (window.location.href!=home)
  {
    window.location = home;
  }
});
于 2013-07-30T09:16:03.217 回答
0

这些线上的东西：

$('document').on("click", function() {
    if ($(this).href != "homepage") {
        window.location = "homepage";
    }
});
于 2013-07-30T09:15:47.610 回答
0

@giorgio 的大量道具。

但是，下面的解决方案回答了我的问题。请注意 tumblr 的 API 阻止了 @giorgio 的工作：

{block:PermalinkPage}
<script type="text/javascript">
    $('body').click(function(e) {
        e.preventDefault();
        window.location = "http://speakingwithpictures.com";
    });
</script>
{/block:PermalinkPage}
于 2013-07-31T12:45:44.110 回答