热门标签 | HotTags
当前位置:  开发笔记 > 编程语言 > 正文

jquery$.post【2014-11-10】

jQuery.post()jQuery.post(url[,data][,success][,dataType])Returns:jqXHRDescription:LoaddatafromtheserverusingaHTTPPOSTrequest.versionadded:

jQuery.post()

jQuery.post( url [, data ] [, success ] [, dataType ] )Returns:jqXHR

Description: Load data from the server using a HTTP POST request.

  • version added:1.0jQuery.post( url [, data ] [, success ] [, dataType ] )

    • url
      Type: String
      A string containing the URL to which the request is sent.
    • //解释一下:URL是必选的参数,其余参数可选。URL是request请求的路径。
    • data
      A plain object or string that is sent to the server with the request.
    • //解释一下:data是浏览器通过request请求向服务器发送一些参数,这个参数的类型可以是字符串类型,也可是plainObject类(感觉和Java中Object差不多)。
    • success
      Type: Function( Object data,String textStatus,jqXHR jqXHR )
      A callback function that is executed if the request succeeds. Required ifdataType is provided, but can be null in that case.
    • //解释一下:success是request请求成功后触发的回调函数。
    • dataType
      Type: String
      The type of data expected from the server. Default: Intelligent Guess (xml, json, script, text, html).
    • //解释一下:dataType是从服务器返回的类型,可以是XML、json、script、text、HTML。

This is a shorthand Ajax function, which is equivalent to:

1
2
3
4
5
6
7
$.ajax({
type: "POST",
url: url,
data: data,
success: success,
dataType: dataType
});

The success callback function is passed the returned data, which will be an XML root element or a text string depending on the MIME type of the response. It is also passed the text status of the response.

//解释一下:上面的$.post可以用$.ajax来替代。

As of jQuery 1.5, the success callback function is also passed a"jqXHR" object (injQuery 1.4, it was passed the XMLHttpRequest object).

Most implementations will specify a success handler:

1
2
3
$.post( "ajax/test.html", function( data ) {
$( ".result" ).html( data );
});

This example fetches the requested HTML snippet and inserts it on the page.

Pages fetched with POST are never cached, so thecache and ifModified options in jQuery.ajaxSetup() have no effect on these requests.

//解释一下:自从jQuery1.5后是用的jqXHR 对象,而以前的版本是用的XMLHttpRequest对象。通过post方法获取的数据不会缓存。

The jqXHR Object

As of jQuery 1.5, all of jQuery's Ajax methods return a superset of theXMLHTTPRequest object. This jQuery XHR object, or "jqXHR," returned by$.get() implements the Promise interface, giving it all the properties, methods, and behavior of a Promise (seeDeferred object for more information). ThejqXHR.done() (for success), jqXHR.fail() (for error), andjqXHR.always() (for completion, whether success or error) methods take a function argument that is called when the request terminates. For information about the arguments this function receives, see thejqXHR Object section of the $.ajax() documentation.

The Promise interface also allows jQuery's Ajax methods, including$.get(), to chain multiple .done(), .fail(), and.always() callbacks on a single request, and even to assign these callbacks after the request may have completed. If the request is already complete, the callback is fired immediately.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
// Assign handlers immediately after making the request,
// and remember the jqxhr object for this request
var jqxhr = $.post( "example.php", function() {
alert( "success" );
})
.done(function() {
alert( "second success" );
})
.fail(function() {
alert( "error" );
})
.always(function() {
alert( "finished" );
});
// Perform other work here ...
// Set another completion function for the request above
jqxhr.always(function() {
alert( "second finished" );
});

//解释一下:向example.php发送请求如果成功就弹出success,如果发送两次都成功了,就弹出second success;如果失败,弹出error;如果完成,弹出finished等。这里的done就是请求成功后执行的函数,fail就是请求失败后执行的函数,always就是无论请求成功还是失败都要执行的函数。

Deprecation Notice

The jqXHR.success(), jqXHR.error(), andjqXHR.complete() callback methods introduced in jQuery 1.5 are deprecated as of jQuery 1.8. To prepare your code for their eventual removal, usejqXHR.done(), jqXHR.fail(), and jqXHR.always() instead.

//解释一下:success、error和complete方法是在jQuery1.5中出现的,现在不推荐使用,推荐用done、fail、always来代替这些函数。

Additional Notes:

  • Due to browser security restrictions, most "Ajax" requests are subject to thesame origin policy; the request can not successfully retrieve data from a different domain, subdomain, port, or protocol.
  • If a request with jQuery.post() returns an error code, it will fail silently unless the script has also called the global.ajaxError() method. Alternatively, as of jQuery 1.5, the.error() method of the jqXHR object returned by jQuery.post() is also available for error handling.
  • //解释一下:由于浏览器的安全策略,来自不同的域,子域、端口和协议时,获取数据可能不成功。

Examples:

Example: Request the test.php page, but ignore the return results.

1
$.post( "test.php" );

Example: Request the test.php page and send some additional data along (while still ignoring the return results).

1
$.post( "test.php", { name: "John", time: "2pm" } );

Example: Pass arrays of data to the server (while still ignoring the return results).

1
$.post( "test.php", { 'choices[]': [ "Jon", "Susan" ] } );

Example: Send form data using ajax requests

1
$.post( "test.php", $( "#testform" ).serialize() );

Example: Alert the results from requesting test.php (HTML or XML, depending on what was returned).

1
2
3
$.post( "test.php", function( data ) {
alert( "Data Loaded: " + data );
});

Example: Alert the results from requesting test.php with an additional payload of data (HTML or XML, depending on what was returned).

1
2
3
4
$.post( "test.php", { name: "John", time: "2pm" })
.done(function( data ) {
alert( "Data Loaded: " + data );
});

Example: Post to the test.php page and get content which has been returned in json format ("John","time"=>"2pm")); ?>).

1
2
3
4
$.post( "test.php", { func: "getNameAndTime" }, function( data ) {
console.log( data.name ); // John
console.log( data.time ); // 2pm
}, "json");

//解释一下:上面是post方法的一些简单举例,涉及的东西还是上面讲到的。

Example: Post a form using ajax and put results in a div

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
<html lang="en">
<head>
<meta charset="utf-8">
<title>jQuery.post demotitle>
<script src="//code.jquery.com/jquery-1.10.2.js">script>
head>
<body>
<form action="/" id="searchForm">
<input type="text" name="s" placeholder="Search...">
<input type="submit" value="Search">
form>
<div id="result">div>
<script>
// Attach a submit handler to the form
$( "#searchForm" ).submit(function( event ) {
// Stop form from submitting normally
event.preventDefault();
// Get some values from elements on the page:
var $form = $( this ),
term = $form.find( "input[name='s']" ).val(),
url = $form.attr( "action" );
// Send the data using post
var posting = $.post( url, { s: term } );
// Put the results in a div
posting.done(function( data ) {
var cOntent= $( data ).find( "#content" );
$( "#result" ).empty().append( content );
});
});
script>
body>
html> //解释一下:post的一个实例,这里只给出了前台页面的jQuery实现。

下面是我写的一个简单的实例(Struts&#43;jQuery实现):

所需jar包:

web.xml:



  ajax
  
    index.html
    index.htm
    index.jsp
    default.html
    default.htm
    default.jsp
  
  
     
        struts2  
        org.apache.struts2.dispatcher.ng.filter.StrutsPrepareAndExecuteFilter  
      
      
        struts2  
        /*  
      

struts.xml:

  
  
  
  
  
      
          
              
                result  
              
          
      
  
  




前台页面(index.jsp):

<%@ page language="java" cOntentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>


	
		
		
		
		
	
	
      	用户名:  
          
        
密码:

这里显示ajax信息:

Action代码:

package action;

import java.util.HashMap;
import java.util.Map;

import net.sf.json.JSONObject;

import com.opensymphony.xwork2.ActionSupport;

public class AjaxLoginAction extends ActionSupport
{
	private static final long serialVersiOnUID= 1L;
	
	private String result;
	private String loginName;
	private String loginPwd;
	
	public String getResult()
	{
		return result;
	}
	public void setResult(String result)
	{
		this.result = result;
	}
	public String getLoginName()
	{
		return loginName;
	}
	public void setLoginName(String loginName)
	{
		this.loginName = loginName;
	}
	public String getLoginPwd()
	{
		return loginPwd;
	}
	public void setLoginPwd(String loginPwd)
	{
		this.loginPwd = loginPwd;
	}
	
	public String execute()
	{
		Map map = new HashMap();
		map.put("name", this.loginName);
		map.put("pwd", this.loginPwd);
		JSONObject jo = JSONObject.fromObject(map);
		this.result = jo.toString();
		System.out.println("==============================");
		System.out.println(result);
		System.out.println("==============================");
		
		return SUCCESS;
	}
	
}

//解释一下:这里实现了post和Ajax两种方法的实现,大家可以对比一下。



如有错误,请指出!谢谢!



推荐阅读
  • Docker的安全基准
    nsitionalENhttp:www.w3.orgTRxhtml1DTDxhtml1-transitional.dtd ... [详细]
  • 本文详细介绍了如何使用PHP检测AJAX请求,通过分析预定义服务器变量来判断请求是否来自XMLHttpRequest。此方法简单实用,适用于各种Web开发场景。 ... [详细]
  • 1:有如下一段程序:packagea.b.c;publicclassTest{privatestaticinti0;publicintgetNext(){return ... [详细]
  • 解决JAX-WS动态客户端工厂弃用问题并迁移到XFire
    在处理Java项目中的JAR包冲突时,我们遇到了JaxWsDynamicClientFactory被弃用的问题,并成功将其迁移到org.codehaus.xfire.client。本文详细介绍了这一过程及解决方案。 ... [详细]
  • 深入理解OAuth认证机制
    本文介绍了OAuth认证协议的核心概念及其工作原理。OAuth是一种开放标准,旨在为第三方应用提供安全的用户资源访问授权,同时确保用户的账户信息(如用户名和密码)不会暴露给第三方。 ... [详细]
  • 前言--页数多了以后需要指定到某一页(只做了功能,样式没有细调)html ... [详细]
  • 本文详细介绍了Java编程语言中的核心概念和常见面试问题,包括集合类、数据结构、线程处理、Java虚拟机(JVM)、HTTP协议以及Git操作等方面的内容。通过深入分析每个主题,帮助读者更好地理解Java的关键特性和最佳实践。 ... [详细]
  • 360SRC安全应急响应:从漏洞提交到修复的全过程
    本文详细介绍了360SRC平台处理一起关键安全事件的过程,涵盖从漏洞提交、验证、排查到最终修复的各个环节。通过这一案例,展示了360在安全应急响应方面的专业能力和严谨态度。 ... [详细]
  • 本文探讨了在不使用服务器控件的情况下,如何通过多种方法获取并修改页面中的HTML元素值。除了常见的AJAX方式,还介绍了其他可行的技术方案。 ... [详细]
  • 本文详细分析了Hive在启动过程中遇到的权限拒绝错误,并提供了多种解决方案,包括调整文件权限、用户组设置以及环境变量配置等。 ... [详细]
  • 本文介绍如何使用阿里云的fastjson库解析包含时间戳、IP地址和参数等信息的JSON格式文本,并进行数据处理和保存。 ... [详细]
  • 本文详细介绍了中央电视台电影频道的节目预告,并通过专业工具分析了其加载方式,确保用户能够获取最准确的电视节目信息。 ... [详细]
  • 本文详细介绍了Git分布式版本控制系统中远程仓库的概念和操作方法。通过具体案例,帮助读者更好地理解和掌握如何高效管理代码库。 ... [详细]
  • 本文介绍了如何利用npm脚本和concurrently工具,实现本地开发环境中多个监听服务的同时启动,包括HTTP服务、自动刷新、Sass和ES6支持。 ... [详细]
  • 本文探讨了在通过 API 端点调用时,使用猫鼬(Mongoose)的 findOne 方法总是返回 null 的问题,并提供了详细的解决方案和建议。 ... [详细]
author-avatar
四川im__miki
这个家伙很懒,什么也没留下!
PHP1.CN | 中国最专业的PHP中文社区 | DevBox开发工具箱 | json解析格式化 |PHP资讯 | PHP教程 | 数据库技术 | 服务器技术 | 前端开发技术 | PHP框架 | 开发工具 | 在线工具
Copyright © 1998 - 2020 PHP1.CN. All Rights Reserved | 京公网安备 11010802041100号 | 京ICP备19059560号-4 | PHP1.CN 第一PHP社区 版权所有