सेट बंद करें


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.