jQuery教程(20)-jquery ajax + php 操作之为Ajax请求提供不同的内容

文章标签: jquery,jquery-ajax
2015-1-15 22:11:07     14 人阅读    

          在返回HTML数据的情况下,我们知道如果只让浏览器自己打开页面而不使用JavaScript,那 么没有样式的文档片段会很难看。为了给没有JavaScript用户提供比这里更好的体验,可以有条件 的加载包含<html>、<head><body>以及其他所有内容的完整的页面。为此,就要利用jQuery 随同Ajax请求一起发送的请求头部。在服务器端代码(这里是PHP)中,我们需要检查X-Requested-With头部。如果存在这个头部而且它的值为XMLHttpRequest,那么就会只发送文档片段;否则,就发送完整的文档。下面是这个想法的基本实现。


 

<?php
$ajax = isset($_SERVER['HTTP_X_REQUESTED_WITH']) &&
$_SERVER['HTTP_X_REQUESTED_WITH'] == 'XMLHttpRequest';
if (!$ajax):
//不是Ajax请求,输出 及开始的<boby>标签 ?>
<!DOCTYPE HTML>
<html lang="en">
<head>
<!-- title, meta, link elements -->
</head>
<body>
<!-- page heading, form, etc.-->
<?php
   endif;
//对Ajax及非Ajax显示相同内容
if (!$ajax):
//关闭针对非Ajax请求的<div>、<boby>和<html>标签 ?>
</body>
</html>
<?php endif; ?>

          现在,我们就有了一个真正渐进增强的例子。没有JavaScript的用户也可以看到可用的表单及 有样式的结果,而那些能使用JavaScript的用户则可以得到更好的体验。
          这种在服务器端提供不同内容的技术甚至支持区别更大的情况。例如,可以对Ajax请求返回 JSON数据,而对其他请求返回HTML:
<?php
$ajax = isset($_SERVER['HTTP_X_REQUESTED_WITH']) && $_SERVER['HTTP_X_REQUESTED_WITH'] == 'XMLHttpRequest';
//设置$entries数组
if ($ajax) {
header('Content-type: application/json'); echo json_encode($entries);
}
else {
//输出完整的HTML文档
}
这样传输的数据就少多了,但在客户端必须构建HTML,就像在代码清单6-9中所做的那样。


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

jQuery教程(21)-jquery ajax 回调函数   上一篇
下一篇  jQuery教程(19)-jquery ajax操作之序列化表单

精彩回复
发表评论
姓名:       

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