首页 > 解决方案 > 在 Ajax 调用中更改 DIV 自动刷新的参数

问题描述

我在#DIV 中有一些内容正在通过 Jquery 刷新。我试图在进行 Ajax 调用后更改刷新间隔,然后在 Ajax 请求完成后更改间隔。

第一部分有效,即一旦 Ajax 进程启动,间隔开始每 2 秒刷新一次,但是一旦 Ajax 完成,#DIV 就会每 2 秒刷新一次,并且不会恢复到 60 秒成功。

这是代码:

<script>
  $(function () {
   $('form').on('submit', function (e) {
        setInterval("my_function();",2000);
    $('#loadingmessage').show(); 

     e.preventDefault();
      $.ajax({
        type: 'post',
        url: 'form.php',
        data: $('form').serialize(),
        success: function (data) {
            $(".content").css("visibility", "visible"); 
            $('#loadingmessage').hide();
            $('#formt').trigger("reset");   
            setInterval("my_function();",60000);
        },
  error: function(data){
    alert('error!');
   }
         });
       });
     });
  </script>

这将设置页面加载时的初始间隔:

<script>
 setInterval("my_function();",60000);      
    function my_function(){
    $('#div').load(location.href + ' #div');
   }
</script>

标签: jqueryajax

解决方案


您需要清除第一个间隔,然后创建新的,见下文

<script>
  $(function () {
   $('form').on('submit', function (e) {
        var interval = setInterval("my_function();",2000);
    $('#loadingmessage').show(); 

     e.preventDefault();
      $.ajax({
        type: 'post',
        url: 'form.php',
        data: $('form').serialize(),
        success: function (data) {
            $(".content").css("visibility", "visible"); 
            $('#loadingmessage').hide();
            $('#formt').trigger("reset");   
            clearInterval(interval); // stop the interval
            setInterval("my_function();",60000);
        },
  error: function(data){
    alert('error!');
   }
         });
       });
     });
  </script>

推荐阅读