सेट बंद करें


120

मैं errorहैंडलर में इस अंतराल को बार-बार चलाने से रोकना चाहता हूं । क्या यह संभव है, और यदि हां, तो कैसे?

// example code
$(document).on('ready',function(){
    setInterval(updateDiv,3000);
});

function updateDiv(){
    $.ajax({
        url: 'getContent.php',
        success: function(data){
            $('.square').html(data);
        },
        error: function(){
            $.playSound('oneday.wav');
            $('.square').html('<span style="color:red">Connection problems</span>');
            // I want to stop it here
        }
    });
}

जवाबों:


242

आपको setIntervalक्लिक हैंडलर के दायरे में एक चर का रिटर्न मान सेट करने की आवश्यकता है , फिर clearInterval()इस तरह का उपयोग करें:

var interval = null;
$(document).on('ready',function(){
    interval = setInterval(updateDiv,3000);
});

function updateDiv(){
    $.ajax({
        url: 'getContent.php',
        success: function(data){
            $('.square').html(data);
        },
        error: function(){
            clearInterval(interval); // stop the interval
            $.playSound('oneday.wav');
            $('.square').html('<span style="color:red">Connection problems</span>');
        }
    });
}

4
डॉक्स के लिए लिंक: clearInterval () और setInterval ()
— ब्रूनो

आप यह भी इस्तेमाल कर सकते हैं setTimout()जो केवल एक बार चलता है
— जस्टिन लियू

21

एक चर का उपयोग करें और clearIntervalइसे रोकने के लिए कॉल करें ।

var interval;

$(document).on('ready',function()
  interval = setInterval(updateDiv,3000);
  });

  function updateDiv(){
    $.ajax({
      url: 'getContent.php',
      success: function(data){
        $('.square').html(data);
      },
      error: function(){
        $.playSound('oneday.wav');
        $('.square').html('<span style="color:red">Connection problems</span>');
        // I want to stop it here
        clearInterval(interval);
      }
    });
  }

11

आपको setIntervalफ़ंक्शन के दिए गए मान को एक वैरिएबल पर असाइन करना होगा

var interval;
$(document).on('ready',function(){
    interval = setInterval(updateDiv,3000);
});

और फिर clearInterval(interval)इसे फिर से साफ़ करने के लिए उपयोग करें।


8

इस का उपयोग करें मुझे आशा है कि आपकी मदद करेंगे

var interval;

function updateDiv(){
    $.ajax({
        url: 'getContent.php',
        success: function(data){
            $('.square').html(data);
        },
        error: function(){
            /* clearInterval(interval); */
            stopinterval(); // stop the interval
            $.playSound('oneday.wav');
            $('.square').html('<span style="color:red">Connection problems</span>');
        }
    });
}

function playinterval(){
  updateDiv(); 
  interval = setInterval(function(){updateDiv();},3000); 
  return false;
}

function stopinterval(){
  clearInterval(interval); 
  return false;
}

$(document)
.on('ready',playinterval)
.on({click:playinterval},"#playinterval")
.on({click:stopinterval},"#stopinterval");

4

हम स्पष्ट अंतराल को कॉल करके आसानी से सेट अंतराल को रोक सकते हैं

var count = 0 , i = 5;
var vary = function intervalFunc() {
  count++;
      console.log(count);
    console.log('hello boy');  
    if (count == 10) {
      clearInterval(this);
    }
}

  setInterval(vary, 1500);

बहुत बुरा अभ्यास। 1 इसका मतलब यह हो सकता है कि यह setIntervalअनिश्चित काल तक लीक हो सकता है - इसे नियंत्रित करने के लिए कोई भी संस्करण जुड़ा नहीं है। 2 आप समय पर स्पष्ट नहीं है this, क्योंकि thisएक समय अंतराल नहीं है। यदि आप उपयोग करते हैं TypeScriptतो आप मुसीबत में पड़ जाएंगे:No overload matches this call.Overload 1 of 2, '(intervalId: Timeout): void', gave the following error: Argument of type 'this' is not assignable to parameter of type 'Timeout'.
— पेड्रो फरेरा

-2

var flasher_icon = function (obj) {
    var classToToggle = obj.classToToggle;
    var elem = obj.targetElem;
    var oneTime = obj.speed;
    var halfFlash = oneTime / 2;
    var totalTime = obj.flashingTimes * oneTime;

    var interval = setInterval(function(){
        elem.addClass(classToToggle);
        setTimeout(function() {
            elem.removeClass(classToToggle);
        }, halfFlash);
    }, oneTime);

    setTimeout(function() {
        clearInterval(interval);
    }, totalTime);
};

flasher_icon({
    targetElem: $('#icon-step-1-v1'),
    flashingTimes: 3,
    classToToggle: 'flasher_icon',
    speed: 500
});
.steps-icon{
    background: #d8d8d8;
    color: #000;
    font-size: 55px;
    padding: 15px;
    border-radius: 50%;
    margin: 5px;
    cursor: pointer;
}
.flasher_icon{
  color: #fff;
  background: #820000 !important;
  padding-bottom: 15px !important;
  padding-top: 15px !important;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet"> 

<i class="steps-icon material-icons active" id="icon-step-1-v1" title="" data-toggle="tooltip" data-placement="bottom" data-original-title="Origin Airport">alarm</i>


4
कृपया बताएं कि यह कोड क्या करता है और यह प्रश्न से कैसे संबंधित है।
— JJJ
हमारी साइट का प्रयोग करके, आप स्वीकार करते हैं कि आपने हमारी Cookie Policy और निजता नीति को पढ़ और समझा लिया है।
Licensed under cc by-sa 3.0 with attribution required.