主页 / 问题 / 1329468
Accepted
jiezzzzzzzzz
Asked:2022-09-17 21:20:38 +0800 CST2022-09-17 21:20:38 +0800 CST

如何在按钮单击时在页面上显示数据？

  • 772

我基于google sheet在python中编写了一个随机短语生成器，我想将它放在一个网站页面上，以便在单击按钮后将短语（来自文本变量）显示在页面上，然后再次单击，一个新的无需重新加载页面即可显示短语。到目前为止，我只有生成器代码，只能缩写。我什至不知道该以何种方式思考。这是我的代码片段，如果有帮助的话：

values_list = []

for value in worksheet.col_values(7):
    values_list.append(value)

text = random.choice(values_list)
python

1 个回答

  1. Best Answer

    项目结构

    ├── generator.py
└── templates
    └── index.html

    生成器.py

    from flask import Flask
import random
from flask.templating import render_template

app = Flask(__name__)

values_list = ['Hello', 'World', 'Python']

# Your code here
# for value in worksheet.col_values(7):
#     values_list.append(value)

@app.route('/')
def root():
    return render_template('index.html')

@app.route('/newword')
def new_word():
    return random.choice(values_list)

app.run()

    索引.html

    <!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<script type="text/javascript">
    function submit() {
        var xhr = new XMLHttpRequest();
        xhr.onreadystatechange = function () {
            if (xhr.readyState === 4) {
                console.log(xhr.response)
                document.getElementById('generator').innerHTML = xhr.responseText
            }
        }
        xhr.open('get', 'http://127.0.0.1:5000/newword', true);
        xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded; charset=UTF-8');
        xhr.send();
    }

</script>
</script>
<body>
    <h4 id="generator">*</h4>
    <input type="submit" value="Generate" onclick="submit()" >
</body>
</html>
    • 1

相关问题