.JQuery中的Ajax

本文介绍了 jQuery 中 load(), $.get() 和 $.post() 方法的基本用法和参数设置,展示了如何通过这些方法实现 HTML 代码的远程加载及数据交互。

1.load()方法

(1)load()方法是jquery中最为简单和常用的ajax方法,能远程载入html代码并插入DOM中,它的结构为:

load(url[,data] [,callback])

laod()方法的参数解释

参数名称类型说明
urlSting请求html页面的URL地址
data[可选]Object发至服务器的key/value数据
callback[可选]Function请求完成是的回调函数,无论请求成功或失败

(2)筛选载入的html文档

load()方法的URL参数的语法结构为:“url selector”,注意:url和选择器之间有空格。

例如:

$("#restext").load("test.html .para");

(3)传递方式

load()方法的传递方式是根据参数data来自动指定。如没有参数传递,则采用GET方法传递,反之,则自动转换为POST方式。

//无参数出传递,则是GET方式

$("#resText").load("test.php",function(responseText,textStatus,XMLHttpRequest){

//回调函数,必须在加载完成才能继续操作

alert(responseText);//请求返回的内容

alert(textStatus);//请求的状态:success,error,notmodified,timeout4种

alert(XMLHttpRequest);//XMLHttpRequest对象

})

//则有参数出传递,则是post方式

$("#resText").load("test.php",{name:"rain",age:"22"},function(responseText,textStatus,XMLHttpRequest){

//回调函数,必须在加载完成才能继续操作

})

2.$.get()方法和$.post()方法

load()方法通常用来从WEB服务器上获取获取静态的数据文件,然而这并不能体现AJAX的全部价值。在项目中,如果需要传递一些参数给服务器的页面,那么可以使用$.get()或者$.post()方法或$.ajax()方法。 

 

(1)$.get()方法是jquery中最为简单和常用的ajax方法,能远程载入html代码并插入DOM中,它的结构为:

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

$.get()方法的参数解释

参数名称类型说明
urlSting请求html页面的URL地址
data[可选]Object发送至服务器的key/value数据会作为JqueryYString附加到请求URL中
callback[可选]Function请求成功时回调函数(只有当党Response的返回状态是success才调用该方法)自动将请求结果和状态传递给该方法

type[可选]String服务器端返回的内容格式,包括xml,html,script,json,text和_default

(2)使用参数

首先,需要确认请求页面的URL地址,代码如下

$("#resText").click(function(){

$.get("get.php" ,{参数},callback)

})

然后,在提交之前,需要获取“姓名”和“内容”的值作为data参数传递给后台。

代码如下

$("#resText").click(function(){

$.get("get.php" ,{

  username:$("#username").val();

  content:$("#content").val();

},function(data,textStatus){//只有当党Response的返回状态是success才调用该方法

//data    //请求返回的内容,可以是xml文档,json文件,html片段等

//textStatus    //请求的状态:success,error,notmodified,timeout4种

})

})

转载于:https://www.cnblogs.com/linjing-blog/p/6727225.html

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值