javascript - jQuery函数 - 通过两次点击返回一个值

Question

我想在 JavaScript 函数中携带一个值，但使用 jQuery 来检测单击或悬停状态。

function foo(bar){
 var choc=bar;
}

当我单击时，foo()我希望它检测第一次单击和第二次单击，以便我可以进行图像交换。

例子：

function foo(bar) {
    var choc=id;    
    $(id).click(function () {
        alert('first click');
    }, function () {
        alert('second click');
    }); 
}

我只能返回第一次点击。这就是我想要做的：

一个不起作用的例子

<a href="javascript:open(5);" class="open">open <img id="5" class="swap5" src="down.png" /></a> 
<div id="box5">press the up button to close me</div>

jQuery

$(document).ready(function() {
        $(".open").click(function(event){
              var id = event.target.id;
              $('#box' + id).slideToggle();
              $(".swap"+id).attr("src", "up.png");
        }, function () {
                var id = event.target.id;
                $('#box' + id).slideToggle();
                $(".swap"+id).attr("src", "down.png");
        });
    });

Answer 1

使用.toggle而不是.click.

$(document).ready(function() {
    $(".open").toggle(function(event){
          event.preventDefault();
          var id = event.target.id;
          $('#box' + id).slideToggle();
          $(".swap"+id).attr("src", "up.png");
    }, function (event) {
          event.preventDefault();
          var id = event.target.id;
          $('#box' + id).slideToggle();
          $(".swap"+id).attr("src", "down.png");
    });
});

也失去了href="javascript:open(5);"标签中的<a>。改为使用href="#"。

Answer 2

This is a pretty hacky solution, but here is my take at it. Declare a counter variable that is initialized at 0. On click increment it and do a check to see if it is 2 to perform your action.

var counter = 0;

function foo(bar) {
  var choc=id;    
  $(id).click(function () {
    if(counter == 2) {
     //Perform action
     counter = 0; //reset counter
    } else {
      counter++;  //Increment counter
    }
  });
}

Answer 3

您是否尝试使用双击事件处理程序？通过访问以下网址查看描述： http: //api.jquery.com/dblclick/ 它有很好的文档记录，因此您应该可以直接找到它来实现