jQuery教程(27)-jQueryajax操作之修改默认选项

文章标签: jquery-ajax,jquery
2015-1-18 17:49:44     44 人阅读    

修改默认选项
             使用$.ajaxSetup()函数可以修改调用Ajax方法时每个选项的默认值。这个函数与 $.ajax()接受相同的选项对象参数,之后的所有Ajax请求都将使用传递给该函数的选项一除 非明确覆盖,参见代码清单6-22。

$.ajaxSetup({ url:'a.html',
type: 'POST',
dataType: 'html
});
$.ajax({
type: 'GET',
success: function(data) {
$('#dictionary').html(data);
});


            这里的操作与前面使用$.ajax()时实现的操作相同,不过由于已经通过$.ajaxSetup() 为请求指定了默认的URL,因此调用$.ajax()时就不需要再指定该选项了。相对而言,虽然 已经把type参数的默认值指定为POST,但在$.ajax()调用中仍然可以覆盖这个值,将其修改 为 GET。


部分加载HTML页面
            本章讨论的第一种,也是最简单的一种Ajax技术,就是取得并将HTML片段插人到当前页面 中。不过,有时候服务器提供的页面中虽然包含我们需要的部分,但该部分之外的HTML却不是 我们所需要的。当遇到这种服务器不能提供适当的数据格式的情况时,也可以在客户端求助 于jQuery。
如果在本章第一个例子中,我们需要的字典解释包含在如下所示的完整的HTML页面 (h.htmi)中:

<html lang="en">
<head>
<meta charset="utf-8"/>
<title>The Devil's Dictionary: H</title>
<link rel="stylesheet" href="dictionary.css" media=MscreenM />
</head>
<body>
<div id="container">
<div id="header">
<h2>The Devil's Dictionary: H</h2>
<div class="author">by Ambrose Bierce</div>
</div>
<div id=MdictionaryM>
<div class="entry">
<h3 class="term">HABEAS CORPUS</h3>
<div class=Mpart">n.</div>
<div class=MdefinitionM>
A writ by which a man may be taken out of jail when confined for the wrong crime.
</div>
</div>
<div class="entry">
<h3 class = __term__>HABIT</h3>
<div class=Mpart">n.</div>
<div class="definition">
A shackle for the free.
</div>
</div>
</div>
</div>
</body>
</html>


           那么,可以通过代码清单6-1中的技术把整个文档都加载到页面中,如代码清单6-23所示。
代码清单6-23
//未完成的代码

$(document).ready(function() {
$('#letter-h a').click(function(event) { event.preventDefault();
$('#dictionary').load('h.html');
});
});


           不过产生的结果并不理想,因为文档中包含不需要的内容(加载的内容中包含页面标题和作 者名,这显然与已有内容重复了),如图6-13所示。

图 6-13

            要去掉页面中多余的内容,可以利用.l〇ad()的一些新特性——在指定要加载文档的URL 时,也可以提供一个jQuery选择符表达式。如果指定了这个表达式,.l〇ad()方法就会利用它查 找加载文档的匹配部分。最终,只有匹配的部分才会被插人到页面中。具体来说,我们可以利用 这个技术,只取得文档中的词条部分,然后插人到页面中,如代码清单6-24所示。
代码清单6-24

$(document).ready(function() {
$('#letter-h a').click(function(event) { event.preventDefault();
$('#dictionary').load('h.html .entry');
});
});


这样,文档中无关的部分已经从页面中去掉了,如图6-14所示。


原文地址:http://www.itmmd.com/201501/515.html
该文章由 萌萌的IT人 整理发布,转载须标明出处。

jQuery教程(28)-jQuery插件开发之使用插件   上一篇
下一篇  jQuery教程(26)-ajax操作之使用JSONP加载远程数据

精彩回复
发表评论
姓名:       

《程序员app》专门为程序员量身定做!