在编写代码的过程中,我们会用到一些的需要局部刷新,而且需要数据传递的情况,我们通常是有$.ajax() ,$.post(),$.get() 这三种方式。

$.ajax()方法通过 HTTP 请求加载远程数据。

最简单的情况下,$.ajax() 可以不带任何参数直接使用。

注意:所有的选项都可以通过 $.ajaxSetup() 函数来全局设置。

$.ajax({
type: "POST", //data 传送数据类型。post 传递
dataType: 'json', // 返回数据的数据类型json
url: "/site/abc", // yii 控制器/方法
cache: false,
data: {tel: tel}, //传送的数据
error:function(){
alert("数据传输错误");
},success: function (data) {
if(window.console){
console.log(data);
}
}
})

$.ajax 的属性:【详解】http://www.w3school.com.cn/jquery/ajax_ajax.asp

dataType

类型:String

预期服务器返回的数据类型。如果不指定,jQuery 将自动根据 HTTP 包 MIME 信息来智能判断,比如 XML MIME 类型就被识别为 XML。在 1.4 中,JSON 就会生成一个 JavaScript 对象,而 script 则会执行这个脚本。随后服务器端返回的数据会根据这个值解析后,传递给回调函数。可用值:

  • "xml": 返回 XML 文档,可用 jQuery 处理。
  • "html": 返回纯文本 HTML 信息;包含的 script 标签会在插入 dom 时执行。
  • "script": 返回纯文本 JavaScript 代码。不会自动缓存结果。除非设置了 "cache" 参数。注意:在远程请求时(不在同一个域下),所有 POST 请求都将转为 GET 请求。(因为将使用 DOM 的 script标签来加载)
  • "json": 返回 JSON 数据 。 输出 数据(yii控制器中)
    public function(){
    echo CJSON::encode($message);
    }

      

  • "jsonp": JSONP 格式。使用 JSONP 形式调用函数时,如 "myurl?callback=?" jQuery 将自动替换 ? 为正确的函数名,以执行回调函数。
  • "text": 返回纯文本字符串

data

类型:String

发送到服务器的数据。将自动转换为请求字符串格式。GET 请求中将附加在 URL 后。查看 processData 选项说明以禁止此自动转换。必须为 Key/Value 格式。如果为数组,jQuery 将自动为不同值对应同一个名称。如 {foo:["bar1", "bar2"]} 转换为 '&foo=bar1&foo=bar2'。

error

类型:Function

默认值: 自动判断 (xml 或 html)。请求失败时调用此函数。

有以下三个参数:XMLHttpRequest 对象、错误信息、(可选)捕获的异常对象。

如果发生了错误,错误信息(第二个参数)除了得到 null 之外,还可能是 "timeout", "error", "notmodified" 和 "parsererror"。

这是一个 Ajax 事件。

$.post() 方法通过 HTTP POST 请求从服务器载入数据。【详细】http://www.w3school.com.cn/jquery/ajax_post.asp

语法:

jQuery.post(url,data,success(data, textStatus, jqXHR),dataType)
参数 描述
url 必需。规定把请求发送到哪个 URL。
data 可选。映射或字符串值。规定连同请求发送到服务器的数据。
success(data, textStatus, jqXHR) 可选。请求成功时执行的回调函数。
dataType

可选。规定预期的服务器响应的数据类型。

默认执行智能判断(xml、json、script 或 html)。

例子:

向页面 test.php 发送数据,并输出结果(HTML 或 XML,取决于所返回的内容):

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

$.get()  【详细】http://www.w3school.com.cn/jquery/ajax_get.asp

例子:

 $("button").click(function(){
$.get("demo_ajax_load.txt", function(result){
$("div").html(result);
});
});

例子 1

请求 test.php 网页,传送2个参数,忽略返回值:

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

例子 2

显示 test.php 返回值(HTML 或 XML,取决于返回值):

$.get("test.php", function(data){
alert("Data Loaded: " + data);
});

例子 3

显示 test.cgi 返回值(HTML 或 XML,取决于返回值),添加一组请求参数:

$.get("test.cgi", { name: "John", time: "2pm" },
function(data){
alert("Data Loaded: " + data);
});

随机推荐

  1. Linux系统调用--mmap/munmap函数详解【转】

    转自:http://www.cnblogs.com/leaven/archive/2011/01/14/1935199.html http://linux.chinaunix.net/techdoc/ ...

  2. 【JQGRID DOCUMENTATION】.学习笔记.5.Form Editing

    JqGrid支持为view ,add, edit,delete, search创建一个on the fly的form.这使得Modal Boxes和行内编辑能够在程序用结合.毕竟,行内编辑只能用在已经 ...

  3. Jetty 嵌入式开发(实例)

    我尝试了jetty几个版本,类的使用有些差异,在此记录下jettyVersion = 9.0.2.v20130417 的部分实例 maven 依赖及配置: <properties> < ...

  4. C#小知识点

    1.显示|隐示转换: public static explicit operator ImplicitClass(ExplicitClass explicitClass) //implicit { I ...

  5. ACM题目————STL练习之Ananagrams

    Description Most crossword puzzle fans are used to anagrams--groups of words with the same letters i ...

  6. C#利用POST实现杭电oj的AC自动机器人,AC率高达50%~~

    暑假集训虽然很快乐,偶尔也会比较枯燥,,这个时候就需要自娱自乐... 然后看hdu的排行榜发现,除了一些是虚拟测评机的账号以外,有几个都是AC自动机器人 然后发现有一位作者是用网页填表然后按钮模拟,, ...

  7. JQuery知识快览之五—操作属性和结构

    前文提到JQuery提供了丰富的内置方法来操作对象集,本文主要介绍JQuery中的那些内置操作属性和DOM结构的方法. prop还是attr? 从JQuery1.6版开始,新增了prop方法来获取和设 ...

  8. 多校5-MZL's Border 分类: 比赛 2015-08-05 21:28 7人阅读 评论(0) 收藏

    MZL's Border Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 65536/65536 K (Java/Others) Total ...

  9. Train Problem I 分类: HDU 2015-06-26 11:27 10人阅读 评论(0) 收藏

    Train Problem I Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 65536/32768 K (Java/Others) ...

  10. 制作动画效果:《CSS3 Animation》

    在开始介绍Animation之前我们有必要先来了解一个特殊的东西,那就是"Keyframes",我们把他叫做“关键帧”,玩过flash的朋友可能对这个东西并不会陌生.下面我们就一起 ...