停止/暂停/中断/中止javascript中的运行函数

stop/pause/break/abort running function in javascript

本文关键字:运行 函数 中止 暂停 中断 停止 javascript      更新时间:2023-09-26

我有这样一个循环函数:

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

添加闪烁停止条件:

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'));
});
$('#someOtherId').on('click', function() {
  // stop blink function
  $('#someId2').stop(true, true)
});