javascript - 如何在一次点击中做某事（不是整个点击）

Question

如果你有这样的事情：

someVar.click(function() {
  $(this).something.happens.here;
  $(this).something.else.happens.here;
  $(this).something.happens.here.that.should.only.run.once;
});

函数内的第三行是否可以在页面上只运行一次？我能想出的唯一解决方案是单独写一个：

someVar.one( "click", function() {
      $(this).something.happens.here.that.should.only.run.once;
    });

但我不想这样做，因为我宁愿将所有内容都保存在一个函数中，主要是因为变量已经在第一次单击范围中定义。多谢你们。

Answer 1

如果您在同一个函数中需要它，您可以使用一个标志：

var shouldRun = true;
someVar.click(function() {
  $(this).something.happens.here;
  $(this).something.else.happens.here;
  if (shouldRun) {
    $(this).something.happens.here.that.should.only.run.once;
    shouldRun = false;
  }
});

Answer 2

正如您所提到的，附加事件one是最优雅的解决方案。或者，您可以设置一个全局变量来指示该函数是否已运行：

var functionHasRun = false
someVar.click(function() {
    $(this).something.happens.here;
    $(this).something.else.happens.here;
    !functionHasRun && $(this).something.happens.here.that.should.only.run.once;
    functionHasRun = true;
});

如果你不是全局变量的粉丝，你可以data在引发事件的元素上设置一个属性：

someVar.click(function() {
    $(this).something.happens.here;
    $(this).something.else.happens.here;
    !someVar.data('functionHasRun') && $(this).something.happens.here.that.should.only.run.once;
    someVar.data('functionHasRun', true);
});

Answer 3

var track=true;

someVar.click(function() {
  $(this).something.happens.here;
  $(this).something.else.happens.here;
  if(track)$(this).something.happens.here.that.should.only.run.once;
  track=false;
});

Answer 4

.one将是我所使用的，否则我只会使用一个函数，我可以在它执行后重新定义为空。

var onlyrunonce = function(){
    $(this).something.happens.here.that.should.only.run.once;
    onlyrunonce = $.noop;
}

someVar.click(function(e) {
  $(this).something.happens.here;
  $(this).something.else.happens.here;
  return onlyRunOnce.call(this,e);
});

Answer 5

这应该为你做：

var handled = false;

someVar.click(function() {
  $(this).something.happens.here;
  $(this).something.else.happens.here;
  if(!handled){
      $(this).something.happens.here.that.should.only.run.once;
      handled = true;
  }

});