`

[JQuery]如何使用POST/GET

阅读更多

Post:

$(function(){
			
			var responseMsg = $('#responseMsg');
			responseMsg.html('');
			
			$('#loginBt').click(function(){
				var username = $('#username').val();
				var password = $('#password').val();
				var url = "login.do";
				$.post(url, {account:username,password:password}, function(data, status){
					console.log('data: ' + data)
					if(data.description == 'Success'){						
						var strFullPath=window.document.location.href; 												
						var strPath=window.document.location.pathname; 						
						var pos=strFullPath.indexOf(strPath); 						
						var prePath=strFullPath.substring(0,pos); 						
						var postPath=strPath.substring(0,strPath.substr(1).indexOf('/')+1);						
						window.location.href=prePath + postPath + '/page/home.html';											
						} else {						
							responseMsg.html('Invalid username or password');					
						}
				})
			})
		});

 

Get:

var url = "login.do?username="+username+"&password="+password;
				$.get(url, function(data, status){
					if(data.description == 'Success'){
						var strFullPath=window.document.location.href; 
						
						var strPath=window.document.location.pathname; 
						var pos=strFullPath.indexOf(strPath); 
						var prePath=strFullPath.substring(0,pos); 
						var postPath=strPath.substring(0,strPath.substr(1).indexOf('/')+1);
						window.location.href=prePath + postPath + '/page/home.html';
						
					} else {
						responseMsg.html('Invalid username or password');
					}
				})

 

 ajax post:

$.ajax({
		url : url,
		beforeSend : function(){
			ajaxLoading();
		},
		type : 'POST',
		data : {
			submit_time_from : submitTimeFrom,
			submit_time_to : submitTimeTo,
			corp_id : corpId,
		
		},
		success : function(data, status){
			ajaxLoadEnd();
			if(data == 'Please login first'){
				responseMsg.html(data);
				return;
			}
			
			var statusCode = data.code;
			if (statusCode == '0') {
				responseMsg.html(data.description);
			} else {
				responseMsg.html(data.description);
			}
		}
		
	});

 

function ajaxLoading(){
  $("<div class=\"datagrid-mask\"></div>").css({display:"block",width:"100%",height:$(window).height()}).appendTo("body");   
  $("<div class=\"datagrid-mask-msg\"></div>").html("Being handling, please wait...").appendTo("body").css({display:"block",left:($(document.body).outerWidth(true) - 190) / 2,top:($(window).height() - 45) / 2});   
}   

function ajaxLoadEnd(){ 
   $(".datagrid-mask").remove();   
   $(".datagrid-mask-msg").remove();               
}

 

分享到:
评论

相关推荐

    jQuery+get/post+Ajax+Json

    标题"jQuery+get/post+Ajax+Json"揭示了这一技术组合如何在现代Web应用程序中实现高效的数据通信。 首先,jQuery是一个轻量级的JavaScript库,它极大地简化了JavaScript的DOM操作、事件处理、动画制作以及Ajax交互...

    简易后台服务post/get

    在Express框架中,我们可以使用`app.get()`和`app.post()`来定义GET和POST请求的处理器。 6. **服务器脚本**:`server.js`通常是Node.js应用的入口文件,它启动服务器并设置监听端口,同时可能包含了路由配置和...

    jQuery中的get()/post()方法

    本篇文章将深入探讨jQuery中的两个核心Ajax方法——`get()`和`post()`,它们用于与服务器进行异步数据交换,是Web开发中不可或缺的部分。 `get()`和`post()`方法是jQuery提供的一对轻量级的Ajax接口,用于实现...

    jquery由GET转成POST方法工具类

    3. **发起POST请求**:使用jQuery的`$.ajax`或简化的`$.post`方法发起POST请求。`$.ajax`允许更灵活的配置,而`$.post`则是一个简化的版本,适用于简单的POST请求。 ```javascript (function($) { $.fn.postSubmit...

    jquery-get-post-load 方法

    本文将详细介绍 jQuery 中 GET、POST 和 LOAD 方法的使用方法及其应用场景。 #### 二、GET方法 GET 方法通常用于从服务器请求数据,而不会更改服务器上的数据。它是一种安全的方法,因为数据是通过 URL 传递的,...

    jquery异步调用post get方式

    `jQuery`提供了`$.ajax()`, `$.post()`, 和 `$.get()`等方法来实现异步请求。本文将深入探讨`jQuery`中的`POST`和`GET`异步调用方式。 1. **GET方式** `GET`是最常见的HTTP请求方法,通常用于获取资源。在jQuery中...

    PHP+Jquery+AJAX POST,GET提交表单并接收返回

    3. **AJAX请求**:使用jQuery的`$.ajax()`或`$.post()`,`$.get()`方法发起异步请求。例如,对于POST请求: ```javascript $.ajax({ type: 'POST', url: 'server_script.php', // PHP处理脚本路径 data: $('...

    jquery-3.5.1.rar

    jQuery的`$.ajax()`, `$.get()`, `$.post()`等方法简化了Ajax请求。例如,`$.get("url", function(data) {...})`将向指定URL发送GET请求,并在成功时执行回调函数。 7. **链式操作** jQuery的一大特性是链式操作...

    jQuery ajax、post、get、json格式传递数据例子

    本篇文章将深入探讨jQuery中的ajax、post、get方法以及如何使用json格式传递数据。 1. **jQuery的$.ajax()函数** `$.ajax()`是jQuery提供的核心Ajax功能,它可以实现异步数据交互。通过配置各种参数,可以灵活地...

    jquery1.7 API/jquery-1.7.1.min.js/jquery-1.7.1.js

    - **$.ajax() 更新**:在1.7版本中,jQuery引入了全新的`$.ajax()`方法,统一了所有异步请求,包括GET、POST等,提供了更加灵活的配置选项。 - **Deferred 对象**:1.7版本加强了对Promise接口的支持,引入了...

    jquery-3.5.1.min.js_jquery-3.5.1.min.js_jquery_

    最后,jQuery的Ajax功能简化了异步数据交互,.ajax()和.get()、.post()方法使得与服务器的数据通信更为便捷。 在JavaScript开发者的工作中,jQuery 3.5.1可以显著提升开发效率。它抽象了浏览器之间的差异,提供了...

    jquery-3.5.1.js/min.js

    最后,jQuery对Ajax的支持也十分全面,`.ajax()`, `.get()`, `.post()`等方法使得异步数据交互变得易如反掌。同时,jQuery的Promise对象和`.done()`, `.fail()`, `.always()`等链式方法,让异步编程变得更加优雅。 ...

    jquery最全面的ajax例子 ajax post get load 应有尽有

    $.get()和$.post()方法 、 $.getScript()和$.getJson() 、 $.ajax()方法 、 序列化元素 、 jQuery中的Ajax全局事件 这些都有详尽的例子,一看代码,你就能明白jquery里实现ajax是怎么回事了,简单明了。

    jQuery/Ajax/PHP/Json 的一个综合例子收藏

    在上述代码中,`url`参数定义了请求的目标PHP脚本,`type`指定请求类型(GET或POST),`dataType`指明我们期望服务器返回的数据类型是Json。 接下来,PHP在服务器端接收到请求后,可以进行数据处理,然后以Json格式...

    ajax POST 与GET提交的区别

    #### 三、AJAX中GET与POST的使用建议 根据上述分析,我们可以得出以下结论: - 对于只需要获取数据且数据量不大、不涉及敏感信息的场景,推荐使用GET请求。 - 对于需要提交大量数据、涉及敏感信息或需要改变服务器...

    jquery-1.11.1.js 、jquery-1.11.1.min.js 【官方jquery包 js】

    - `$.get()`/`.post()`:简化版的Ajax请求,用于快速实现GET和POST操作。 - `$.getJSON()`:专门用于获取JSON数据的函数。 7. **`.min.js`版本** 压缩后的`jquery-1.11.1.min.js`通过删除注释、合并变量、压缩...

    jquery-2.1.1.js 、jquery-2.1.1.min.js 【jquery包 js】

    `$.get()`, `$.post()`等简化了常见的GET和POST请求。 6. **插件生态系统**:jQuery拥有庞大的插件生态系统,如jQuery UI提供丰富的界面组件,jQuery Validation用于表单验证,Bootstrap则是基于jQuery的前端框架。...

    jquery-1.11.3.js 、jquery-1.11.3.min.js 【官方jquery包 js】

    还有`$.get()`, `$.post()`等简化版的API,使得Ajax请求更为便捷。 6. **链式操作(Chaining)** jQuery的一个显著特点是链式操作,一个jQuery对象可以连续调用多个方法,这使得代码更加紧凑,如 `$("#element")....

    jQuery中Ajax的get、post等方法详解.docx

    以上就是jQuery中Ajax的get、post方法以及getScript和getJSON方法的基本使用和理解。这些方法在实际开发中非常常用,能够实现页面的动态更新和与服务器的交互,提高了用户体验。通过合理利用这些方法,可以构建更加...

Global site tag (gtag.js) - Google Analytics