1. jQuery load() 方法

jQuery load() 方法是简单但强大的 AJAX 方法。

load() 方法从服务器加载数据，并把返回的数据放入被选元素中。

语法：

$(selector).load(URL,data,callback);

必需的 URL 参数规定您希望加载的 URL。

可选的 data 参数规定与请求一同发送的查询字符串键/值对集合。//这个就是往服务器传数据的

可选的 callback 参数是 load() 方法完成后所执行的函数名称。//

下面的例子把 "demo_test.txt" 文件中 id="p1" 的元素的内容，加载到指定的 <div> 元素中：

实例

$("#div1").load("demo_test.txt #p1");

2. jQuery get() 和 post() 方法用于通过 HTTP GET 或 POST 请求从服务器请求数据。

 

首先要了解什么是 HTTP？

超文本传输协议（HTTP）的设计目的是保证客户机与服务器之间的通信。

HTTP 的工作方式是客户机与服务器之间的请求-应答协议。

Web 浏览器可能是客户端，而计算机上的网络应用程序也可能作为服务器端。

举例：客户端（浏览器）向服务器提交 HTTP请求；服务器向客户端返回响应。响应包含关于请求的状态信息以及可能被请求的内容。

还有get（）和post（）的区别

·  GET 请求可被缓存

·  GET 请求保留在浏览器历史记录中

·  GET 请求可被收藏为书签

·  GET 请求不应在处理敏感数据时使用

·  GET 请求有长度限制

·  GET 请求只应当用于取回数据

·  POST 请求不会被缓存

·  POST 请求不会保留在浏览器历史记录中

·  POST 不能被收藏为书签

·  POST 请求对数据长度没有要求

 

GET

POST

后退按钮/刷新

无害

数据会被重新提交（浏览器应该告知用户数据会被重新提交）。

书签

可收藏为书签

不可收藏为书签

缓存

能被缓存

不能缓存

编码类型

application/x-www-form-urlencoded

application/x-www-form-urlencoded 或 multipart/form-data。为二进制数据使用多重编码。

历史

参数保留在浏览器历史中。

参数不会保存在浏览器历史中。

对数据长度的限制

是的。当发送数据时，GET 方法向 URL 添加数据；URL 的长度是受限制的（URL 的最大长度是 2048 个字符）。

无限制。

对数据类型的限制

只允许 ASCII 字符。

没有限制。也允许二进制数据。

安全性

与 POST 相比，GET 的安全性较差，因为所发送的数据是 URL 的一部分。

在发送密码或其他敏感信息时绝不要使用 GET ！

POST 比 GET 更安全，因为参数不会被保存在浏览器历史或 web 服务器日志中。

可见性

数据在 URL 中对所有人都是可见的。

数据不会显示在 URL 中。

例子get：

<script>

$(document).ready(function(){

$("button").click(function(){

$.get("/example/jquery/demo_test.asp",function(data,status){

alert("数据：" + data + "\n状态：" + status);

});

});

});

</script>

<%
response.write("This is some text from an external ASP file.")
%>

结果会出来：

"数据：This is some text from an external ASP file.  状态：success

Post例子：

就用servlet吧。

第一个是MyServlet.Java

package com.fish;

import java.io.IOException;

import java.io.PrintWriter;

import javax.servlet.ServletException;

import javax.servlet.http.HttpServlet;

import javax.servlet.http.HttpServletRequest;

import javax.servlet.http.HttpServletResponse;

public class MyServlet extends HttpServlet {

public void doPost(HttpServletRequest request, HttpServletResponse response)

throws ServletException, IOException {

PrintWriter out = response.getWriter();

System.out.println(request.getParameter("name"));//这个等会从juqery里面获取

System.out.println(request.getParameter("text"));

out.print("aa");

out.print("bb");

//

}

}

然后将1.9的js框架导入，

在jsp这么写

<%@ page language="java"import="java.util.*"pageEncoding="utf-8"%>

<%

String path = request.getContextPath();

String basePath = request.getScheme() +"://"

+ request.getServerName() +":" + request.getServerPort()

+ path + "/";

%>

<!DOCTYPEHTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

<html>

<head>

<basehref="<%=basePath%>">

<title>My JSP 'MyJsp.jsp' starting page</title>

<scripttype="text/javascript"src="jquery-1.9.1.js"></script>//放入js框架

<scripttype="text/javascript">

$(document).ready(function() {

$("p").click(function() {

$.post("servlet/MyServlet",         //这个是MyServlet的路径

{

name:"你好",                                //第二个是以json格式的传值，和上面servet的名相同，这样就可以传到服务器。

text:"我是千岛飞鱼"

},

function(data,status){                   //从服务器读的内容会在data里面。Status这个读取的状态

alert("Data: " + data +"\nStatus: " + status);

});

});

});

</script>

</head>

<body>

<p>点击我</p>

</body>

</html>

所以结果在eclispe控制台会显示：你好我是千岛飞鱼。

在浏览器会弹出：Data:aabb   Status:sucess

利用jquery对ajax操作，详解原理（附代码）的更多相关文章

  1. 触碰jQuery：AJAX异步详解

    触碰jQuery:AJAX异步详解 传送门:异步编程系列目录…… 示例源码:触碰jQuery:AJAX异步详解.rar AJAX 全称 Asynchronous JavaScript and XML( ...

  2. 触碰jQuery：AJAX异步详解（转）

    AJAX 全称 Asynchronous JavaScript and XML(异步的 JavaScript 和 XML).它并非一种新的技术,而是以下几种原有技术的结合体. 1)   使用CSS和X ...

  3. jQuery调用AJAX异步详解[转]

    AJAX 全称 Asynchronous JavaScript and XML(异步的 JavaScript 和 XML).它并非一种新的技术,而是以下几种原有技术的结合体. 1)   使用CSS和X ...

  4. jQuery中 $.ajax()方法详解

    $.ajax()方法详解 jquery中的ajax方法参数总是记不住,这里记录一下. 1.url: 要求为String类型的参数,(默认为当前页地址)发送请求的地址. 2.type: 要求为Strin ...

  5. Jquery使用ajax参数详解

    记录一下  Jquery使用ajax(post.get及参数详解) 1.get: $.ajax({ type: "GET", url: baseUrl + "Showco ...

  6. jQuery的DOM操作详解

    DOM(Document Object Model-文档对象模型):一种与浏览器, 平台, 语言无关的规则, 使用该接口可以轻松地访问页面中所有的标准组件DOM操作的分类 核心-DOM: DOM Co ...

  7. Jquery的AJAX应用详解

    案例一:取得服务端当前时间 简单形式:jQuery对象.load(url),返回结果自动添加到jQuery对象代表的标签中间 <body> 当前时间: <span id=" ...

  8. jquery datatable ajax配置详解

    我写的这个东西类似于个人笔记,如果你想要完整的而了解 可以去这里看看 http://dt.thxopen.com/ 包括英文原网站都不错. 通过配置ajax的属性和服务器交互 $("sele ...

  9. jQuery之$.ajax()方法详解及实例

    1.url: 要求为String类型的参数,(默认为当前页地址)发送请求的地址. 2.type: 要求为String类型的参数,请求方式(post或get)默认为get.注意其他http请求方法,例如 ...

随机推荐

  1. 快速构建Windows 8风格应用1-开发工具安装及模拟器使用

    原文:快速构建Windows 8风格应用1-开发工具安装及模拟器使用 本篇博文主要介绍的是开发Windows 8风格应用中常用的两个开发工具:Visual Studio 2012和Expression ...

  2. 快速构建Windows 8风格应用20-MediaElement

    原文:快速构建Windows 8风格应用20-MediaElement 本篇博文主要介绍MediaElement概述.MediaElement对象介绍.MediaElement常用属性.如何控制媒体播 ...

  3. Linux启用/关闭触摸板脚本

    一个可以启动关闭触摸板的shell脚本 运行一次关闭,再次运行开启. [shell] #!/bin/bash ts=`synclient -l|grep TouchpadOff` ts=${ts#*= ...

  4. 安装Visual Source Safe 2005 - 初学者系列 - 学习者系列文章

    本文介绍微软的文档管理工具Visual Source Safe 2005的安装 从下列地址获取该工具: ed2k://|file|en_vss_2005.iso|108048384|C4BEC1EC3 ...

  5. bootstrap-paginator 分页插件笔记

    [MVC]bootstrap-paginator 分页插件笔记   bootstrap-paginator基于bootstrap框架,使用起来非常简单.官网:http://harttle.github ...

  6. VS2010新建Web网站与新建Web应用程序的区别

    在Visual Studio 2010中,除了可以使用“创建Web应用程序”的方式来构建自己的Web项目之外,还可以通过创建“Web网站”的方式来构建Web项其中,Web网站的创建方法:打开Visua ...

  7. BackgroundWorker组件使用总结

    首先在窗体拖入一个BackgroundWorker组件,根据功能需要设置BackgroundWorker的属性 WorkerSupportsCancellation = true; 允许取消后台正在执 ...

  8. Maven包装过程中跳过测试

    在具体项目,步骤需要跳过假设检验,应采取skipTests此属性设置为true. <pre name="code" class="html">< ...

  9. WebService和AngularJS实现模糊过滤查询

    WebService和AngularJS实现模糊过滤查询   [概要] 网上看到一个不错的帖子,用WebService获取json,然后在前端使用AngularJs进行过滤搜索,看完文章后,按自己的想 ...

  10. NET实现仓库看板的一些感想

    NET实现仓库看板的一些感想 从一名技术开发人员到实施人员的蜕变,从不同的角度看待同一个问题,或许会有不一样的结果.这里记录一下最近一个项目实施的案例,非常有感触! 一. 项目情况简介 本次项目是给一 ...