javascript - 带有 if else 条件的 jQuery "one"方法

Question

我正在努力使用 if 和 else 条件来实现 jQuery 的“.one”方法。我只需要执行一次这个点击函数，无论条件为真还是假。

请检查下面的代码以简化我的问题。

$("span").one("click", function () {
	var ind = $("span").index($(this));
  
	if (ind == 0) {
  	alert ("clicked 1st element");
  }
  
  else {
    alert ("clicked 2nd element");
  }
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<span>1st click element</span><br>
<span>2nd click element</span>

Answer 1

在您的情况下，您有两个 span 标签。因此，您为两者附加了一个事件。

行:

$("span").one("click", function () {

“等同于”以下两行:

$("span:eq(0)").one("click", function () {
$("span:eq(1)").one("click", function () {

这就是原因，因为您收到两个事件。

如果您想停止第二个事件并仅获取第一个事件，您可以考虑删除事件处理程序:

$("span").one("click", function () {
  
  // remove the event for the second span...
  $("span").off("click");
  
  
  var ind = $("span").index($(this));

  if (ind == 0) {
    alert ("clicked 1st element");
  }

  else {
    alert ("clicked 2nd element");
  }
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script>


<span>1st click element</span><br>
<span>2nd click element</span>