Flask Ajax 调用在网页收到数据后刷新

Question

我正在做一个烧瓶项目，它从一个表单（只有一个输入）获取数据并使用 ajax POST 请求我将它发布到服务器和 return 数据同一页。在 return 中，我看到网页收到了 returned 数据，但它会自动刷新。我不知道这里发生了什么。这是我的相关代码。

$(document).ready(function(){
     $("#button").click(function(){
        var userID=$("#userID").val();
        $.ajax({
            url:'/maturity',
            type:"POST",
            data:{userID:userID}
            }).done(function(data){
                 percentageval=data.id;
                 console.log(data.id);

            });
        });
 });

stack_overflow = Blueprint('stack_overflow', __name__)

@stack_overflow.route("/maturity", methods=["POST"])
def maturity():    
    data=request.form["userID"]
    print(data)
    id=46
    return jsonify({"id":46})

我在这里创建了一个成熟度根来获取 POST 数据和 return 所需的值。这是我正在使用的默认根目录，在 ajax 调用页面后再次刷新到此页面。

http://127.0.0.1:5000/stack_overflow

我已检查数据是否已从 jasonify 接收到服务器，并且数据已 return 发送到网页，但问题是在那之后再次刷新页面。谁能帮我解决这个问题。

Answer 1

您是否在表单中使用了以下代码？

<button type="submit">Click Me</button>

然后更改按钮的类型。

<button type="button">Click Me</button>

也许您应该使用 'submit'-事件而不是 'click'-事件。

Flask Ajax 调用在网页收到数据后刷新

Flask Ajax call getting refreshed after data received to web page

ajax

jquery

post

flask

jsonify