前端篇-jquery发送数据的三种方式

前端篇-jquery发送数据的三种方式

1、get请求

<script src="/js/jquery-1.11.3.js"  ></script>
<script>
    // 1-采用get方式发送数据
    function jq_get(){
        //$.get("http://localhost:8080/save?username=zs&password=123",function(obj){
        var params = {
                "username":"zhangsan",
                "password":"123"
        }
        $.get("http://localhost:8080/save",params,function(data,status){
            alert(JSON.stringify(data))
        },"json");
    }
</script>

2、post请求，方式1

发送请求的：Content-Type 为: application/x-www-form-urlencoded; charset=UTF-8

$(document).ready(function(){
            $("#button3").click(function(){
                var params={"user":"长官","pass":"1234"}
                $.post("http://localhost:5000/post1",params,
                    function(data,status){
                        
                        //data 为jscript对象，返回data对象的内容可以使用下面两种
                        alert(data.user)
                        alert(data["user"])
                        $("#test1").text(JSON.stringify(data)); //data对象转换为json字符串
                        
                        
                        var s_json = JSON.stringify(data)
                        js_object = JSON.parse(s_json) #json字符串可以再转为jscript对象

                    });
            });
        });

3、post请求，方式2

发送请求的：Content-Type 为：application/json

        $(document).ready(function(){
            $("#button4").click(function() {
                var params = {"user": "长官三", "pass": "1234"}
                var jsonData = JSON.stringify(params);//转为json字符串
                $.ajax({
                    url: "http://localhost:5000/post2",
                    method: 'post',
                    // 通过headers对象设置请求头
                    headers: {'Content-Type': 'application/json'},
                    data: jsonData,
                    dataType: 'json',
                    //async: true,
                    success:function (data,status) {
                        alert(data.user)
                        $("#test1").text(JSON.stringify(data));
                    },
                    error:function(e){
                        console.log('ajax请求异常，异常信息如下：', e);
                    }
                })
            })
        });

4、补充：jquery发送的get/post请求默认的编码格式为utf-8

$.get的默认字符编码是urf-8，$.post的默认字符编码是utf-8.

jquery 版本：https://cdn.staticfile.net/jquery/1.10.2/jquery.min.js

参考：https://www.runoob.com/jquery/jquery-ajax-get-post.html