首页 前端知识 前端篇-jquery发送数据的三种方式

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

2024-05-12 00:05:00 前端知识 前端哥 200 943 我要收藏

前端篇-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

转载请注明出处或者链接地址:https://www.qianduange.cn//article/8209.html
标签
okhttp
评论
发布的文章

JQuery中的load()、$

2024-05-10 08:05:15

大家推荐的文章
会员中心 联系我 留言建议 回顶部
复制成功!