Question

我想通过jQuery在每次点击不同链接后显示一个弹出窗口。

我有不同的链接会在页面刷新后进入相关页面。如何在每4个链接点击后显示弹出窗口？

<a href="home.html">Home</a>
<a href="about.html">About</a>
<a href="portfolio.html">Portfolio</a>
<a href="Contact.html">Contact</a>
<a href="faq.html">FAQ</a>

这是我正在使用的脚本

(function () {
    var count = 0;
    $(a).click(function () {
        count += 1;
        if (count == 4) {
            // popup code
        }
    });
})();

Answer 1

您可以使用$.data()存储该特定链接的点击次数，如下所示：

$(document).ready(function(){
  
  $("a").click(function(e){
    e.preventDefault();
      if($(this).data("numberOfClicks")){
        var currentClicks = $(this).data("numberOfClicks");
        currentClicks++;
        $(this).data("numberOfClicks",currentClicks);

        if(currentClicks % 4 == 0)
          alert($(this).text()+" clicked "+currentClicks+" times...!");
        }
    else
      {
        $(this).data("numberOfClicks",1);
        }
    });
  });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<a href="home.html">Home</a>
<a href="about.html">About</a>
<a href="portfolio.html">Portfolio</a>
<a href="Contact.html">Contact</a>
<a href="faq.html">FAQ</a>

Answer 2

试试这个：您可以为每个链接提供计数数据，如果点击不是第四次点击，请致电e.preventDefault()。

＆＃13;

$(function(){
   $('a').click(function(e){
         var count = parseInt($(this).data('count')) || 0;
         count++;
         if(count%4!=0)
            e.preventDefault();
          
         $(this).data('count',count);
   });    

});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<a href="home.html">Home</a>
<a href="about.html">About</a>
<a href="portfolio.html">Portfolio</a>
<a href="Contact.html">Contact</a>
<a href="faq.html">FAQ</a>

＆＃13;

Answer 3

<html>
<head>
    <script src="https://code.jquery.com/jquery-1.9.1.min.js"></script>
    <script>
        $(document).ready(function () {

            var $count = 0;

            $('a').click(function () {

                $count += 1;

                if ($count == 4) {

                    alert(" 4 clicks on different  links");

                    //define the event  function here
                    // bind the event  with the html elements 
                }
            });



        });



    </script>
</head>
<body>
    <a  id="home"href="#">Home</a>
    <a href="#">About</a>
    <a href="#">Portfolio</a>
    <a href="#">Contact</a>
    <a href="#">FAQ</a>

</body>
</html>

enter code here

如何在jquery点击链接后触发事件

3 个答案: