Jquery在异步提交方面封装的很好,直接用AJAX非常麻烦,Jquery大大简化了我们的操作,不用考虑浏览器的诧异了。
推荐一篇不错的jQuery Ajax 实例文章,忘记了可以去看看,地址为:
http://www.w3school.com.cn/jquery/
和
http://www.w3school.com.cn/jquery/ajax_ajax.asp
和
http://www.cnblogs.com/yeer/archive/2009/07/23/1529460.html
和
http://www.php100.com/html/program/jquery/2013/0905/5973.html
$.post、$.get是一些简单的方法,如果要处理复杂的逻辑,还是需要用到jQuery.ajax()
一、$.ajax的一般格式
$.ajax({
type: 'POST',
url: url ,
data: data ,
success: success ,
dataType: dataType
});
二、$.ajax的参数描述
参数 描述
url 必需。规定把请求发送到哪个 URL。
data 可选。映射或字符串值。规定连同请求发送到服务器的数据。
success(data, textStatus, jqXHR) 可选。请求成功时执行的回调函数。
dataType
可选。规定预期的服务器响应的数据类型。
默认执行智能判断(xml、json、script 或 html)。
三、$.ajax需要注意的一些地方:
1.data主要方式有三种,html拼接的,json数组,form表单经serialize()序列化的;通过dataType指定,不指定智能判断。
2.$.ajax只提交form以文本方式,如果异步提交包含<file>上传是传过不过去,需要使用jquery.form.js的$.ajaxSubmit
四、$.ajax我的实际应用例子
//1.$.ajax带json数据的异步请求
var aj = $.ajax( {
url:'productManager_reverseUpdate',// 跳转到 action
data:{
selRollBack : selRollBack,
selOperatorsCode : selOperatorsCode,
PROVINCECODE : PROVINCECODE,
pass2 : pass2
},
type:'post',
cache:false,
dataType:'json',
success:function(data) {
if(data.msg =="true" ){
// view("修改成功!");
alert("修改成功!");
window.location.reload();
}else{
view(data.msg);
}
},
error : function() {
// view("异常!");
alert("异常!");
}
});
//2.$.ajax序列化表格内容为字符串的异步请求
function noTips(){
var formParam = $("#form1").serialize();//序列化表格内容为字符串
$.ajax({
type:'post',
url:'Notice_noTipsNotice',
data:formParam,
cache:false,
dataType:'json',
success:function(data){
}
});
}
// $.ajax提交(附件+表单)
<form id= "uploadForm">
<p >指定文件名: <input type="text" name="filename" value= ""/></p >
<p >上传文件: <input type="file" name="file"/></ p>
<input type="button" value="上传" onclick="doUpload()" />
</form>
function doUpload() {
var formData = new FormData($( "#uploadForm" )[0]); // 要求使用的html对象
$.ajax({
url: 'http://localhost:8080/cfJAX_RS/rest/file/upload' ,
type: 'POST',
data: formData,
async: true,
// 下面三个参数要指定,如果不指定,会报一个JQuery的错误
cache: false,
contentType: false,
processData: false,
success: function (returndata) {
alert(returndata);
},
error: function (returndata) {
alert(returndata);
}
});
}
//3.$.ajax拼接url的异步请求
var yz=$.ajax({
type:'post',
url:'validatePwd2_checkPwd2?password2='+password2,
data:{},
cache:false,
dataType:'json',
success:function(data){
if( data.msg =="false" ) //服务器返回false,就将validatePassword2的值改为pwd2Error,这是异步,需要考虑返回时间
{
textPassword2.html("<font color='red'>业务密码不正确!</font>");
$("#validatePassword2").val("pwd2Error");
checkPassword2 = false;
return;
}
},
error:function(){}
});
//4.$.ajax拼接data的异步请求
$.ajax({
url:'<%=request.getContextPath()%>/kc/kc_checkMerNameUnique.action',
type:'post',
data:'merName='+values,
async : false, //默认为true 异步
error:function(){
alert('error');
},
success:function(data){
$("#"+divs).html(data);
}
});
分享到:
相关推荐
asp+ajax(jQuery)实例($.ajax()、$.post()、$.get()、$.getJSON()四种模式可选 Ajax是目前比较流行的网站建设技术,尤其作为网站建设者来说,掌握它十分有必要,如果用原生Javascript开发则比较困难,还好有强大的...
$.post、$.get是一些简单的方法,如果要处理复杂的逻辑,还是需要用到jQuery.ajax() 一、$.ajax的一般格式 $.ajax({ type: 'POST', url: url , data: data , success: success , dataType: dataType }); 二、...
以上就是关于 jQuery AJAX 的实例详解,包括 $.ajax, $.post 和 $.get 的使用方法以及一些实际应用场景。通过这些方法,我们可以轻松地在客户端与服务器之间进行数据交互,实现页面的无刷新更新。
- jQuery的$.getJSON()和$.get()、$.post()方法使AJAX请求更易编写,同时提供了一系列便利的事件处理函数,简化了页面元素的操作。 - 结合使用,可以轻松实现如分页链接的点击事件监听,触发AJAX请求,更新页面...
此外,还有一些其他的选项,如`contentType`(请求的Content-Type头)、`crossDomain`(是否跨域请求)、`xhrFields`(自定义XMLHttpRequest实例字段)等,它们进一步增强了$.ajax()方法的灵活性。 使用$.ajax()...
它包括一系列易于使用的函数,如 `$.ajax()`、`$.get()` 和 `$.post()` 等,这些函数可以帮助开发者快速实现 Ajax 请求。 #### 三、核心方法详解 ##### 1. load() - **函数签名**:`load(url[, data][, callback]...
在这个"基于JQuery框架的AJAX实例代码"中,我们将探讨如何使用jQuery提供的API,包括`$.ajax`,`$.post`和`$.get`,来实现异步数据传输。 1. **$.ajax()** `$.ajax()`是jQuery中最全面的AJAX方法,它可以处理GET和...
jQuery的核心AJAX方法是`$.ajax()`,它支持所有AJAX选项。例如,创建一个基本的GET请求: ```javascript $.ajax({ url: "myScript.php", type: "GET", success: function(response) { console.log(response);...
标题中的"spring框架项目+jQueryAjax提交实例"指的是一个整合了Spring框架和jQuery AJAX技术的Web应用程序项目。这个项目提供了一个完整的流程,演示了如何在前端使用jQuery的AJAX功能向后端Spring MVC控制器发送...
除了`$.ajax()`,jQuery还提供了一些简化的版本,如`$.get()`和`$.post()`,用于快速实现GET和POST请求。例如,要使用GET请求获取数据: ```javascript $.get('api/data', function(responseData) { // 处理返回的...
jQuery的$.ajax()函数是进行异步数据请求的核心,它支持GET和POST等多种HTTP方法,同时提供dataType选项来指定返回的数据类型,如json、xml、html等。$.getJSON()和$.getScript()分别用于获取JSON数据和加载...
jQuery封装了AJAX操作,提供了一套简洁的API,如`$.ajax()`, `$.get()`, `$.post()`等,使开发者能够轻松地实现AJAX请求。 分页通常分为两种类型:服务器端分页和客户端分页。服务器端分页意味着每次用户翻页时,...
除了`$.ajax`方法,jQuery还提供了简化版本的`$.post`和`$.get`方法。例如: ```javascript // $.post 方法 $('#test_post').click(function () { $.post( 'ajax_json.php', // 后台处理程序 { username: $('#...
2. 使用`$.get()`和`$.post()`简写方法:对于简单的GET和POST请求,可以使用这两个方法,如: ```javascript $.get('/Home/GetData', function(data) { // 处理返回的数据 }); $.post('/Home/AddData', { name: '...
1. `$.ajax()`: 这是最常用的AJAX函数,它可以接受一系列参数,包括URL、请求类型(GET或POST)、数据、回调函数等,可以进行复杂的AJAX请求。 2. `$.get()`: 用于发起GET请求,它接受URL和回调函数作为参数,返回...
为了方便开发者,jQuery还提供了一些简化的Ajax方法,如`$.get()`, `$.post()`, `$.getJSON()`, 和 `$.load()`。比如使用`$.post()`进行POST请求: ```javascript $.post('example.php', { key: 'value' }, ...
jQuery提供`$.getJSONP()`或在`$.ajax()`中设置`dataType: 'jsonp'`来实现。 ### 8. 路径和数据缓存 默认情况下,Ajax请求不会缓存数据。如果需要开启缓存,可以在Ajax设置中添加`cache: true`。 ### 9. 阻止页面...