jquery.ajax参数时间例子

本文介绍了一个使用jQuery发起AJAX请求的示例,演示了如何通过点击按钮触发POST请求,并展示了请求过程中的各种事件处理,包括开始前、成功、失败及完成等回调函数的应用。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

总结分享!

<input id='mybtn' type="button" value='点我'  />
	<input id='mysubmit' type="button" value='提交'  />
	<div id='msg' >123</div>

$(function() {
			$('#mybtn').on('click',function(){
				$.ajax({url:'你的url地址'
// 	 				,global:false    // 全局事件开关,true=参与全局事件,false=不参与全局事件
					,type:"post"
	 				,dataType:"json"
	 				,data:{"type":"3"}
	 				,async:false
	 				,success:function(data){
	 					//每次ajax执行完成如果成功就回调此函数,此函数与error函数不可以同时触发
// 	 					console.log('success:');
// 	 					console.log(data);
	 					}
	 				,complete:function(XMLHttpRequest,textStatus){
	 					//每次ajax执行完成都会触发此回调函数,不管成功与否。
	 					console.log('complete');
	 					//延迟三秒后,放开提交按钮
	 					setTimeout(function(){
	 						$('#mysubmit').removeAttr("disabled");
	 					},3000);
	 				}
	 				,error:function(data){
	 					//每次ajax执行完成如果失败就回调此函数,此函数与succcess函数不可以同时触发
// 	 					console.log('错误:');
	 				}
	 				,beforeSend:function(){
	 					//每次ajax执行前触发此函数,可防止重复提交数据
	 					console.log('before');
	 					//提交按钮禁用
	 					$('#mysubmit').attr({disabled:"disabled"});
	 				}
	 			});
	 		});
		});
		$(document).ajaxComplete(function(event,request,settings){
			//全局ajax处理完成走此方法
		});
		$(document).ajaxSuccess(function(event,request,settings){
			//全局ajax处理成功走此方法
// 			console.log('success:'+settings.url);
// 			alert('success');
		});
		$(document).ajaxError(function(event, jqxhr, settings, exception){
			//全局ajax处理失败走此方法
// 			console.log('error:'+settings.url);
// 			alert('error');
		});
		$(document).ajaxStart(function() {
// 			console.log('start:');
// 			   alert('start:');
		});
		$(document).ajaxSend(function(event,request,settings){
// 			console.log('send:'+settings.url);
// 			alert('send');
		});
		$(document).ajaxStop(function() {
// 			console.log('stop:');
// 			   alert('stop:');
		});


### jQuery AJAX 使用教程 #### 简介 jQuery 提供了一系列用于执行 AJAX 请求的方法,简化了前端开发者的工作流程。除了核心的 `$.ajax()` 方法外,还存在多个便捷函数如 `$.get()`, `$.post()`, `$.getJSON()`, 和 `$.getScript()` 来满足不同场景下的需求[^1]。 #### 核心方法:`$.ajax()` 这是最全面也最为灵活的方式来进行AJAX操作: ```javascript $.ajax({ url: "test.html", // 请求地址 context: document.body, // 上下文环境 success: function(){ $(this).addClass("done"); // 成功回调 } }); ``` 此段代码展示了最基本的配置项;实际应用中还可以指定更多参数比如数据类型(`dataType`)、HTTP动词(method)等以适应具体业务逻辑的需求[^3]。 #### 简化版APIs 对于简单的GET或POST请求来说,可以采用更为简便的形式: - **获取资源** ```javascript // 发送 GET 请求并处理 JSON 数据 $.get('server.php', {name: 'John'}, function(data){ console.log(data); }, 'json'); ``` - **提交表单** ```javascript // POST 方式提交数据到服务器端脚本 $.post('submit.php', $('#myform').serialize(), function(responseText){ alert('Data Loaded: ' + responseText); }); ``` 上述例子分别演示了如何利用`.get()`读取远程文件以及通过`.post()`上表单信息给后台处理器。 #### 控制全局事件 有时可能需要阻止某些特定情况下触发的全局AJAX事件(像页面加载动画),这时可以通过设置选项来实现这一点: ```javascript $.ajaxSetup({global : false}); // 关闭所有后续请求中的全局事件监听 ``` 当设定了`global:false`之后,则不会再自动触发展示进度条之类的交互效果[^2]。 ---
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值