jQuery异步ajax

一、jQuery中的$.ajax({settings})方法

$.ajax({settings});

type:类型,"POST"或"GET",默认值为"GET"

url:发送请求的地址

async:设置异步,(默认: true) 默认设置下,所有请求均为异步请求。如果需要发送同步请求,

请将此选项设置为 false。注意,同步请求将锁住浏览器,用户其它操作必须等待请求完成才可以执行。

data:是一个对象,连同请求发送到服务器的数据

dataType:预期服务器返回的数据类型,如果不指定,jQuery将自动根据http包MIME信息来智能判断,

一般我们采用json格式,可以设置为"json"

success:是一个方法,请求成功后的回调函数,传入返回后的数据,以及包含成功代码的字符串

error:是一个方法,请求失败是调用此函数,传入XMLHttpRequest对象

例:

jQuery中ajax方法从服务器上获取数据

        function jqGetData() {

            $.ajax({

                type: "get",

                url: "/jQueryAjax/getPersonInfor",

                async:true,//如果设置的值为true则可以省略该行代码

                dataType: "json",

                success: function (data) {

                    console.log(data);//js对象

                    $("#txtName").val(data.name);

                    $("#cboSex").val(data.sex);

                    $("#txtAddress").val(data.address);

                }

            })

        }

(1)jQuery中ajax方法将表单数据提交给服务器

表单序列化

 serialize() 序列表单内容为字符串,用于 Ajax 请求

 serializeArray() 序列化表单元素 (类似 '.serialize()' 方法) 返回 JSON 数据结构数据。

注意:此方法返回的是JSON对象而非JSON字符串。需要使用插件或者第三方库进行字符串化操作

 返回的JSON对象是由一个对象数组组成的,其中每个对象包含一个或两个名值对——name参数和value参数

二、jQuery中的$.post() $.get() $.getJSON()

1、jQuery中的$.get()方法

语法:$.get(url, [data], [callback], [type])

描述:通过远程 HTTP GET 请求载入信息。

这是一个简单的 GET 请求功能以取代复杂 $.ajax 。请求成功时可调用回调函数。如果需要在出错时执行函数,请使用 $.ajax。

参数说明:

url:发送请求地址。

data:待发送 Key/value 参数。

callback:发送成功时回调函数。

type:返回内容格式,xml, html, script, json, text, _default。

例:使用$.get()方法从服务器上获取数据

function getFun() {

            $.get("/jQueryAjax/getPersonInfor", function (data) {

                $("#txtName").val(data.name);

                $("#cboSex").val(data.sex);

                $("#txtAddress").val(data.address);

            }, "json");

        }

2、jQuery中的$.post()方法

语法:$. post (url, [data], [callback], [type])

描述:通过远程 HTTP POST 请求载入信息。

这是一个简单的 POST 请求功能以取代复杂 $.ajax 。请求成功时可调用回调函数。如果需要在出错时执行函数,请使用 $.ajax

参数说明:

url:发送请求地址。

data:待发送 Key/value 参数。

callback:发送成功时回调函数。

type:返回内容格式,xml, html, script, json, text, _default。

例:

function postFun() {

            var strname = $("#txtName").val();

            var strsex = $("#cboSex").val();

            var straddress = $("#txtAddress").val();

            if (strname == "" && strsex == 0 && straddress == "") {

                alert("请检查表单是否填写完毕!");

                return false;

            }

            var frmData = $("#myform").serializeArray();

            $.post("/jQueryAjax/getDataByRequest", frmData, function (msg) {

                alert(msg);

            });

        }

3、jQuery中的$.getJSON()方法

语法:$.getJSON(url, [data], [callback])

描述:通过 HTTP GET 请求载入JSON数据

参数说明:

      url:发送请求地址。

      data:待发送 Key/value 参数。

      callback:发送成功时回调函数

例:

function getJSONFun() {

            var name = $("#txtName").val();

            var sex = $("#cboSex").val();

            var address = $("#txtAddress").val();

            if (name == "" && sex == 0 && address == "") {

                alert("请检查表单是否填写完毕!");

                return false;

            }

            var frmData = $("#myform").serializeArray();

            $.getJSON("/jQueryAjax/getDataByEntityClass", frmData, function (msg) {

                console.log(msg);

                alert(msg);

            });

        }

注:url:发送请求地址 为举例,不可复制

 

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值