javascript - javascript中的停止/暂停/中断/中止运行功能

Question

我在循环中有这个函数：

function blink(selector){
  $(selector).fadeOut(800, 'easeInQuint', function(){
    $(this).fadeIn(800, function(){
      blink(this);
    });
  });
}

我可以这样称呼它：

$('#someId').on('click', function() {
  blink('#someId2');
});

但是我怎么能阻止它呢？

$('#someOtherId').on('click', function() {
  // stop blink function
});

Answer 1

添加停止条件以闪烁：

function blink(selector,stop){
  if (stop) {
    $(selector).stop(true,true).show();
    return;
  }
  $(selector).fadeOut(800, 'easeInQuint', function(){
    $(this).fadeIn(800, function(){
      blink(this);
    });
  });
}


$('#someOtherId').on('click', function() {
  blink(theidtostop, true)
  // stop blink function
});

您也可以改为blink使用适当的方法转换为模块。

var blink = {
    blinkingElements: [],
    doBlink: function () {
        $(this.blinkingelements)
            .fadeIn( 800, 'easeInQuint' )
            .fadeOut( 800, $.proxy( this.doBlink, this ) );
    },
    startBlink: function ( el ) {
        this.blinkingElements = blinkingElements.concat( $.makeArray(el) );
        this.doBlink();
    },
    stopBlink: function () {
        $(this.blinkingElements).stop(true,true).show();
    }
    clearBlinkingElements: function () {
        this.stopBlink();
        this.blinkingElements = [];
    }
}

$('#someId').on('click', function() {
    blink.clearBlinkingElements();
    blink.startBlink($('#someId2'));
});
$('#someOtherId').on('click', function() {
    blink.clearBlinkingElements();
    blink.startBlink($('#someOtherId2'));
});

或者干脆

$('.somecommonclass').on('click', function() {
    blink.clearBlinkingElements();
    blink.startBlink($('#' + this.id + '2'));
});

Answer 2

$('#someOtherId').on('click', function() {
  // stop blink function
  $('#someId2').stop(true, true)
});