JavaScript jQuery 中 ajax 的简单使用

JS 对象转字符串

var str = JSON.stringify(obj)

JS 字符串转对象

var obj = JSON.parse(str)

后端使用 Flask 写一个可以返回数据的路由：

from flask import Flask, render_template
app = Flask(__name__)

@app.route("/")
def index():
    return render_template("ajax_demo.html")

@app.route("/getUserInfo/")
def get_user_info(username):
    user_info = {}
    if username == "zhangsan":
        user_info = {"username": "zhangsan", "age": 3, "mail": "1@1.com"}
    return {"data": user_info, "status": 200}

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

前端 html 页面 ajax_demo.html

    
    
    
    



提交

运行效果：

如果直接点击提交，JS 会在 p 标签写入文字

  if ($("#user").val() == ""){
            $("#userinfo").text("内容不能为空！")

写入任意字符，调用后端接口，返回数据

写入符合需求的用户信息，返回数据

将 success 的回调函数做下修改，返回一个表格看看：

                success: function(data){
                    //$("#userinfo").text(JSON.stringify(data))
                    //console.log(data["data"])
                    for (var key in data.data){
                        $("#userinfo").append(''+key+''+data.data[key]+'')
                    }