Stop setInterval в AJAX JQuery

Question

вопрос для тех, кто более опытен, чем я. Как я могу остановить выполнение setInterval с этим кодом и не использовать основную функцию? Спасибо за помощь.

$(".scrivi-messaggio").click(function() 
{   
    var username_utente = $('#username-utente').val();  
    $('.modal-title').html('Chat di '+username_chat); 

    setInterval(function() 
    { 

     $.get("//localhost/laravel/public/index.php/stampa_messaggi/"+id, 

     function(data) 
     { 
      data_parsed = JSON.parse(data); 

      var resultHtml = ''; 

      $.each(data_parsed, function(i, el) 
      { 
       if(el.id_user === id_user) 
       { 
        resultHtml += "<a href='http://localhost/laravel/public/index.php/utente/" + id_user + "' style='font-weight: bold;'>" + username + "</a> " + el.contenuto + "<br />"; 
       } 
       else 
       { 
        resultHtml += "<a href='http://localhost/laravel/public/index.php/utente/" + el.id_user + "' style='font-weight: bold;'>" + username_utente + "</a> " + el.contenuto + "<br />"; 
       } 
      }); 

      $(".stampa-messaggi").html(resultHtml).show(); 

     }); 
    }, 2000);  
}); 

Answer 1

Создать вар для вашего интервала:

var myInterval = setInterval(function(){/*...*/}, 2000); 

, а затем использовать clearInterval, чтобы остановить его:

clearInterval(myInterval); 

Чтобы очистить интервал с одним нажатием на кнопку:

$('#buttonID').on("click", function() { 
    if (typeof myInterval != 'undefined') clearTimeout(myInterval); 
}); 

Answer 2

setInterval возвращает
An integer with the ID value of the timer that is set. Use this value with the clearInterval() method to cancel the timer.ref

так что вы можете использовать clearInterval передавая этот идентификатор в качестве параметра ref

Answer 3

Если запрос AJAX выходит из строя или продлевается на какой-либо причине, setInterval() будет продолжать делать новый запрос.

Поскольку вы делаете запрос AJAX каждый так часто, что вы должны делать это с помощью setTimeout() в функции обратного вызова, которая будет сделать новый запрос только тогда, когда последний является полным. Вы можете поместить свой код в функцию и вызвать эту функцию с каждым таймаутом.

Вы можете сохранить свой тайм-аут в переменной в доступном объеме, а затем очистить его на нажатие кнопки:

var myTimeout = undefined, 
    getData = function() { 
    $.get("//localhost/laravel/public/index.php/stampa_messaggi/" + id, 
    function (data) { 
     data_parsed = JSON.parse(data); 

     var resultHtml = ''; 

     $.each(data_parsed, function (i, el) { 
      if (el.id_user === id_user) { 
       resultHtml += "<a href='http://localhost/laravel/public/index.php/utente/" + id_user + "' style='font-weight: bold;'>" + username + "</a> " + el.contenuto + "<br />"; 
      } else { 
       resultHtml += "<a href='http://localhost/laravel/public/index.php/utente/" + el.id_user + "' style='font-weight: bold;'>" + username_utente + "</a> " + el.contenuto + "<br />"; 
      } 
     }); 
     $(".stampa-messaggi").html(resultHtml).show(); 

     myTimeout = setTimeout(getData, 2000); 
    }); 
} 

$(".scrivi-messaggio").click(function() { 
    var username_utente = $('#username-utente').val(); 
    $('.modal-title').html('Chat di ' + username_chat); 
    getData();  
}); 

$('button').click(function(){ 
    if(typeof myTimeout != 'undefined') clearTimeout(myTimeout); 
}); 

Answer 4

setInterval() возвращает некоторый дескриптор называется intervalId, которые могут быть переданы в clearInterval' stop the interval associated with it! There for you should assign the return value of setInteval() ` к переменной.

var intervalId 
//declare it outside the click scope so that you can access it later 
$(".scrivi-messaggio").click(function() 
{   
    var username_utente = $('#username-utente').val();  
    $('.modal-title').html('Chat di '+username_chat); 

    intervalId = setInterval(function(){/*What ever the function does*/}, 2000);  
}); 

и остановить интервал позже вы можете использовать clearInterval(intervalId) Надеюсь, что это помогает!