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. ユーザーが 2 番目の div (2 番目のイベント) をクリックすると、そのリンクのページ (yahoo.com) に移動します。

  3. ユーザーが 3 番目の div (3 番目のイベント) をクリックすると、baidu.com ではなくカスタム URL に移動します。

  4. しかし、ユーザーが 3 番目の div をもう一度クリックすると (4 番目のイベント)、baidu.com に移動します。

要約すると、クリック イベントを登録し、3 回目のイベントごとにユーザーをカスタム URL にリダイレクトする jQuery コードのアイデアが必要です。

私が最初に教えたのはトグルを使用することですが、実装できるかどうかはわかりません。

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

You can store the number of clicks in memory using jQuery's data() and re-set it every 3 clicks when going to your custom link if that is what you need like this:

$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);
});​

DEMO - All but every 3rd click go to assigned link

If you don't want to re-set the counter you can simply stop incrementing it after the third like this:

$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);
    }
});​

DEMO - All but 3rd click go to assigned link

于 2012-12-04T16:36:00.940 に答える