Question

<script>

主要功能：

var interval;                     
function refreshId(session_to_user) {
interval = setInterval(function()
{
$('.chat-box').load("<?php echo base_url()."users/message/refresh_div/"; ?>" + session_to_user);
}, 10000);
}

在这个主要功能中我只会在这里执行我的要求。我有一个可变间隔我启用此功能，它将每10秒刷新一次。

onclick of function

forloop
{   
<a href = "" onclick="myFunction(user_id)"
}   

function myFunction(user_id){      
clearInterval(interval); 
$.ajax({                        
success:function(data)
{     
    $('.chats').html(data);
}
})   
refreshId(session_to_user);  
}

如果有人点击href，它应该是clearInterval如果已经存在，则必须在click函数上建立新的Interval。在我当前的代码中，如果我第一次点击它就可以了。它每10秒开始刷新第一个链接，但是当我在第二个链接上第二次点击时，它会等待。仍然，第一个执行，然后第二个执行。我的要求是，如果我点击，建立的setInterval必须立即停止，新的必须在现场开始，与我的下一个函数paper_plane（）相同。

function paper_plane()
{  
clearInterval(interval); 
$.ajax({
 success:function(html)
{
$('#chat').append(html);
$('.chat-input').val('');
$('.chat-input').focus();
}
});
}
var side_bar_path = "<?php echo base_url()."users/message/load_side_bar"; ?>";
$.ajax({
success : function(data)
{
$('.msg-list').html(data);
}
});
refreshId(session_to_user); 
}

Answer 1

从first click handler经过延迟（10秒）后，您无法取消ajax请求，因为它不会立即返回结果。

所以在进行新的ajax调用之前，你可以取消之前的ajax调用的唯一方法是suppress/ignore一旦第二个链接被触发，之前的ajax调用的响应，这样你就会创建一个场景期待。

下面我创建了一个小片段，它将完成上述场景。

JS代码：

 var firstTimer;
//first click handler
$('#first').on('click',function () {

  firstTimer= setInterval(function (){
              $.ajax({
                 url:"http://target.org/page.html",
                 dataType: "POST",
                 data:{'name1':'davy'}
                 success: function(data) {
                     //suppress the response when timer is stopped. 
                     if(firstTimer>0){
                        return;
                     }    
                     //if timer is not stopped process the data    
                 },
                 error :function(error) {
                     //handle error
                 }     
              });
          },1000);
});

//second click handler
$('#second').on('click',function () {
  //clear the firstTimer before staring a new timer
  clearInterval(firstTimer);
  var timer;
  timer = setInterval(function (){
              $.ajax({
                 url:"http://target.org/page2.html",
                 dataType: "POST",
                 data:{'name1':'rog'}
                 success: function(data) {
                    //process the data 
                 },
                 error :function(error) {
                     //handle error
                 }    
              });
          },1000);
});

javascript中的clearInterval和setInterval立即生效

1 个答案: