flask如何用jquery做到同步后端随时更新的数据

前端
ssgx.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<script src="https://g.csdnimg.cn/??lib/jquery/1.12.4/jquery.min.js"></script>
<body>
<input type="checkbox" checked id="1">实时更新
<br>
<textarea id="t" style="width: 100px; height: 20px;rows=10;"></textarea>
更新<input type="button"  id="r">
</body>
<script>
    $('#r').click(function(){
        var url='/a';
        var s={};

        $.post(url,s,function(refresh){
                        if($('#1').is(':checked')) {
                        s.t=refresh.t;
                        setInterval(
                            function startRequest() {

                            $('#t').val(s.t);
        }, 500);

                    }
                    else{

                        $('#t').val(refresh.h);
                    }

        })

    })
</script>
</html>

后端ssgx.py

from flask import Flask, render_template,jsonify

from threading import Thread

import time

count = 0


def foo():
    global count
    while True:
        time.sleep(1)
        count += 1
        print(count)


t1 = Thread(target=foo)
t1.start()




app = Flask(__name__)

app.secret_key = 'x'


class Config(object):
    DEBUG = True



app.config.from_object(Config)


@app.route('/', methods=['GET', 'POST'])
def index():
    return render_template('ssgx.html')


@app.route('/a', methods=['GET', 'POST'])
def refresh():

    data = {//t模拟一直更新的数据
        't': count,
        'h': 'h20'
    }
    return jsonify(data)


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


前端同步时有问题,如何改动代码能够使得自动更新勾选时,可以点击一次更新按钮后,textarea中不用点击更新,可以一直自动同步更新后台数据(t模拟的是一直更新的数据)

用setInterval定时器来实时更新
你题目的解答代码如下:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<script src="https://g.csdnimg.cn/??lib/jquery/1.12.4/jquery.min.js"></script>
<body>
<input type="checkbox" checked id="1">实时更新
<br>
<textarea id="t" style="width: 100px; height: 20px;rows=10;"></textarea>
更新<input type="button"  id="r">
</body>
<script>
    $('#r').click(function(){
        var url='/a';
        var s={};
        $.post(url,s,function(refresh){
            $('#t').val(refresh.h);
        })
    })
    setInterval(function(){
        if($('#1').prop("checked"))
            $('#r').click();
    }, 2000);
</script>
</html>
 

如有帮助,请点击我的回答下方的【采纳该答案】按钮帮忙采纳下,谢谢!

img

您好,我是有问必答小助手,您的问题已经有小伙伴帮您解答,感谢您对有问必答的支持与关注!
PS:问答VIP年卡 【限时加赠:IT技术图书免费领】,了解详情>>> https://vip.csdn.net/askvip?utm_source=1146287632