jQuery 函数 - 单击两次返回一个值

jQuery Function - return a value with two clicks

本文关键字:返回 一个 两次 函数 单击 jQuery      更新时间:2023-09-26

我想在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");
        });
    });

使用 .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");
    });
});

同时丢失<a>标记中的href="javascript:open(5);"。 请改用href="#"

这是一个非常笨拙的解决方案,但这是我的看法。声明一个初始化为 0 的计数器变量。单击递增它并检查它是否为 2 以执行您的操作。

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

您是否尝试使用双击事件处理程序?通过转到以下位置查看说明:http://api.jquery.com/dblclick/它有很好的文档记录,所以你应该发现它可以直接实现