带有计时器的 jQuery/AJAX 调用答案

【问题标题】：jQuery/AJAX call with a timer带有计时器的 jQuery/AJAX 调用
【发布时间】：2011-10-13 23:38:42
【问题描述】：

如何使用 jQuery/AJAX 计时器实现以下代码，（我使用 web.py 创建了 2 个 URL 类。这里第一个 URL 将返回 1 到 250 之间的随机数。我在第二个 URL，这样当您点击按钮时，AJAX 将调用第一个 URL 中的值，并将显示在文本框中），现在我只想修改代码，就像每 5 秒 AJAX 应该调用第一个中的数字URL，它应该显示在文本框中。有没有办法通过使用 jQuery/AJAX 计时器来解决这个问题。

import web
import random

urls = (
  '/', 'main',
  '/random','fill')


app = web.application(urls, globals(), True)

class main:
    def GET(self):
       return  random.randint(1,250)


class fill:
    def GET(self):
        return'''
        <html>
        <head>
        <script type="text/javascript" src="http://ajax.microsoft.com/ajax/jquery/jquery-1.4.2.min.js"></script>
        <script type="text/javascript">
        $(document).ready(function(){
        $("button").click(function(){
          $.ajax({url:"http://127.0.0.1:8080/", success:function(result){
             $("#text").val(result);
          }});
        });});
        </script>
        </head>
        <body>


        <form>
        <input type = "text" id = "text"/>
        </form>
        <h2>Hit the button to view random numbers</h2>
        <button>Click</button>
        </body>
        </html>'''



if __name__ == "__main__":
    app.run()

【问题讨论】：

标签： javascript jquery ajax web.py

【解决方案1】：

当 ajax 调用从服务器返回时，创建一个计时器，该计时器将在 n 毫秒后再次轮询服务器。无论完成 ajax 调用需要多长时间，这种方法都应该有效。

$("button").click(function refreshText(){
    $.ajax({
        url:"http://127.0.0.1:8080/",
        success:function(result){
            $("#text").val(result);
            setTimeout(refreshText, 5000);
        }
    });
});

【讨论】：

【解决方案2】：

您可以创建一个函数并设置一个 JavaScript 计时器以每 5 秒调用一次：

<script type="text/javascript">
displayNumbers() {
    $.ajax({url:"http://127.0.0.1:8080/", success:function(result){ $("#text").val(result); }});
}

$(document).ready(function() {
    setInterval('displayNumbers', 5000);
}
</script>

我没有检查代码，但你明白了。

【讨论】：

感谢您的建议。
如果 ajax 调用需要超过 5 秒才能完成怎么办？