设置间隔ajax请求

时间:2018-12-09 13:13:41

标签: javascript

大家好,我遇到SetInterval的问题,我已经尝试过使用它来刷新我的请求,但是它不起作用

setInterval(test, 10000);
$.get("https://ipinfo.io",
    function test(response) {
        console.log(response.ip, response.country);
        var body = document.getElementsByTagName('body')[0]
        var creatediv = function(s1, s2, s3, s4) {
            var div = document.createElement('div');
            div.appendChild(s1);
            div.appendChild(s2);
            return div;
        }
        var createspan = function(value) {
            var span = document.createElement('span');
            span.innerText = value;
            return span;
        }
        body.appendChild(creatediv(createspan('Your IP adress:  '), createspan(response.ip)))
        body.appendChild(creatediv(createspan('Your City:  '), createspan(response.city)))
        body.appendChild(creatediv(createspan('Country:  '), createspan(response.country)))
        body.appendChild(creatediv(createspan('Postal Code:  '), createspan(response.postal)))


    }, "jsonp")

2 个答案:

答案 0 :(得分:0)

您需要在间隔回调中调用$.get()

setInterval(test, 1000);

function test() {
  $.get("https://ipinfo.io",
    function test(response) {
      console.log(response.ip, response.country);
      var body = document.getElementsByTagName('body')[0]
      var creatediv = function(s1, s2, s3, s4) {
        var div = document.createElement('div');
        div.appendChild(s1);
        div.appendChild(s2);
        return div;
      }
      var createspan = function(value) {
        var span = document.createElement('span');
        span.innerText = value;
        return span;
      }
      body.appendChild(creatediv(createspan('Your IP adress:  '), createspan(response.ip)))
      body.appendChild(creatediv(createspan('Your City:  '), createspan(response.city)))
      body.appendChild(creatediv(createspan('Country:  '), createspan(response.country)))
      body.appendChild(creatediv(createspan('Postal Code:  '), createspan(response.postal)))


    }, "jsonp");
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

答案 1 :(得分:0)

第一个问题是刷新将永远不会刷新。大概您想每秒从ipinfo获取最新数据,然后更新显示以显示该信息。
设置的test()函数仅包含更新显示所需的逻辑-不获取数据。

下一个问题是,您尝试在setInterval中调用的test()函数是作为闭合函数创建的,该函数在全局范围内不可用。
您可以单独定义test()来更正此问题。

将这两个修复程序结合在一起,将允许setInterval调用服务器并操纵页面。

function test() {
    $.get("https://ipinfo.io",
        function (response) {
            console.log(response.ip, response.country);
            var body = document.getElementsByTagName('body')[0]
            var creatediv = function(s1, s2, s3, s4) {
                var div = document.createElement('div');
                div.appendChild(s1);
                div.appendChild(s2);
                return div;
            }
            var createspan = function(value) {
                var span = document.createElement('span');
                span.innerText = value;
                return span;
            }
            body.appendChild(creatediv(createspan('Your IP adress:  '), createspan(response.ip)))
            body.appendChild(creatediv(createspan('Your City:  '), createspan(response.city)))
            body.appendChild(creatediv(createspan('Country:  '), createspan(response.country)))
            body.appendChild(creatediv(createspan('Postal Code:  '), createspan(response.postal)))
        }, "jsonp")
}