1

我在以下情况下创建了一个小提琴，我想知道如何用 jQuery 实现它。

我有几个像这样的div：

<div class="mydiv"><a href="http://www.google.com">google.com</a></div>

<div class="mydiv"><a href="http://www.yahoo.com">yahoo.com</a></div>

<div class="mydiv"><a href="http://www.baidu.com">baidu.com</a></div>

列表还在继续（O 有大约 20 个 div）。

  1. 当用户点击第一个 div（第一个事件）时，他将转到该链接的页面（在我的例子中是 google.com）；

  2. 当用户点击第二个 div（第二个事件）时，他会转到那个链接的页面（yahoo.com）；

  3. 当用户点击第三个div（第3个事件）时，会转到一个CUSTOM URL，而不是baidu.com；

  4. 但是如果用户再次点击第三个div（第4个事件），他会去baidu.com

总而言之，我需要一个注册点击事件的 jQuery 代码的想法，并且在每个第三个事件上，用户将被重定向到自定义 url。

我第一次教的是使用切换，但我不确定它是否可以实现。

4

3 回答 3

2

即使您离开页面，此解决方案也会维护一个计数器：

$(function(){
    var nbc = localStorage['nbc']||0;
    $('a').click(function(){
        localStorage['nbc'] = ++nbc;
        if (nbc%3==0) {
           document.location = "yourUrl";
           return false; // in case the link opens in another page
        }
    });
});

编辑，评论中问题的一些答案：

要在新选项卡中打开 html 链接，请执行以下操作：

<a href=... target=_blank>text</a>

要在新选项卡（或窗口，取决于浏览器和首选项）中以编程方式打开，请使用

window.open("yourUrl");

只有当您控制新页面并且它来自同一来源时，才能在打开后获得开启器窗口焦点。在这种情况下，只有您可以在新页面中使用它：

window.opener.focus();
于 2012-12-04T16:31:37.823 回答
1

试试这个：

$(document).ready(function(){
  var counter = 0;
  $('.mydiv a').on('click', function(event){
    counter = counter < 3 ? counter + 1 : 0;

    if (counter == 3) {
      event.preventDefault();
      window.location.href = "http://stackoverflow.com";
    }
  });
});

上面的代码应该在用户点击时将他们重定向到您的自定义 URL。显然，您可以设置点击次数限制以及自定义 URL。

请小心劫持用户的点击:)

编辑

查看实际代码：http: //jsfiddle.net/robertp/GHnvd/3/

于 2012-12-04T16:30:18.700 回答
1

您可以使用 jQuery 的data()将点击次数存储在内存中，并在转到自定义链接时每 3 次点击重新设置一次，如果这是您需要的，如下所示：

$document = $(document);
$document.data("linksClicked", 0);

$(".mydiv a").on("click", function() {
    var clicks = $document.data("linksClicked");

    clicks += 1;

    if (clicks === 3) {
        // go to special link
        clicks = 0;
        $document.data("linksClicked", clicks);
        return false;
    }

    $document.data("linksClicked", clicks);
});​

演示- 除每 3 次点击外，所有点击都转到分配的链接

如果您不想重新设置计数器，您可以简单地在第三个之后停止增加它，如下所示：

$document = $(document);
$document.data("linksClicked", 0);

$(".mydiv a").on("click", function() {
    var clicks = $document.data("linksClicked");

    if (clicks < 3) {
        clicks += 1;

        if (clicks === 3) {
            // go to special link
            $document.data("linksClicked", clicks);
            return false;
        }

        $document.data("linksClicked", clicks);
    }
});​

演示- 除了第 3 次单击之外的所有内容都转到分配的链接

于 2012-12-04T16:36:00.940 回答