python中ajax的封装传参

最新推荐文章于 2022-07-19 11:56:56 发布

原创最新推荐文章于 2022-07-19 11:56:56 发布 · 297 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#python #ajax #封装

该博客展示了如何在HTML中封装一个Ajax函数，并通过按钮点击触发GET和POST请求。同时，给出了一个使用Flask框架处理这些请求的Python代码示例，分别对应GET和POST方法，返回不同的响应信息。

Ajax 封装

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <title>07_ajax的封装传参</title>
</head>

<body>
    <h1>07_ajax的封装传参</h1>
    <input type="button" value="测试get参数" onclick="test1()" />
    <input type="button" value="测试post参数" onclick="test2()" />
    <script>
        function ajax(options) {
            var xhr = new XMLHttpRequest()
            var params = ''
            for (var atr in options.data) {
                params = params + atr + '=' + options.data[atr] + '&'
            }
            params = params.substr(0, params.length - 1)
            //get请求
            if (options.type == 'get') {
                options.url = options.url + "?" + params
            }

            xhr.open(options.type, options.url)
            //post请求
            if (options.type == 'post') {
                xhr.setRequestHeader('Content-type','application/x-www-form-urlencoded')
                xhr.send(params)
            }else{
                xhr.send()
            }

            xhr.onreadystatechange = function () {
                if (xhr.readyState == 4 && xhr.status == 200) {
                    console.log(xhr.responseText)
                }
            }
        }

        function test1() {
            ajax({
                type: 'get',
                url: '/login',
                data: { 'name': '吕小布', 'pwd': 123 }
            })
      
        }
        function test2(){
            ajax({
                type: 'post',
                url: '/login',
                data: { 'name': '吕小布', 'pwd': 123 }
            })
        }
    </script>
</body>

</html>

#导入模块
from flask import Flask, request, render_template  
                                                   
app = Flask(__name__)                              
                                                   
                                                   
@app.route('/login', methods=['GET', 'POST'])      
def login():                                       
    if request.method == 'GET':                    
        return 'get请求成功'                           
    elif request.method == 'POST':                 
        return 'post请求成功'
 @app.route('/fz02')                                  
def fz02():                                          
    return render_template('07_ajax的封装传参 copy.html')

图片:
在这里插入图片描述