很多朋友都认为ajax能提高网页的速度,但是我更喜欢用ajax来提高用户体验和平衡动态页面与静态页面之间的关系。我曾经乱谈过ajax,原因在于有几个朋友认准了一个死理:那就是ajax对改善速度的作用是大大的!而今天的这篇文章中,我想重点谈一谈如何在wordpress系统中使用ajax,也就是如何通过修改模板或者插件在wordpress中灵活的运用ajax。
对了,如果你还不太清楚ajax的基本原理,请自行google之,本站就不再为互联网贡献垃圾了。在实际的操作中,我们运用ajax的方式大部分情况下为异步请求(当然你也可以设置成同步模式),异步请求的好处在于浏览器在载入html的同时,后台也会用js请求数据,所以载入数据的时候感觉不到任何卡页的现象。由于数据的请求是由JS控制,因此你可以将ajax代码嵌入到静态化的wordpress页面中,从而将部分的内容通过ajax做实时的请求,而本文的目的便在于此。
下面举例说明如何运用ajax在静态的首页中实时的请求最新留言(如果你已经使用了 cos-html-cache,这个例子没有必要了,因为 cos-html-cache在有新的留言的时候会自动更新首页)。首先我们想到的应该是如何去产生最新留言这个数据,这里有两种方式,一种是插件,另外一种就是直接修改模板,其实归根结底都一样,所以我们就用插件来举例,按照本人的老规矩,所有的说明均在下面代码中的注释里面体现。
/*
Plugin Name: GetLatestComment
Plugin URI: http://www.storyday.com
Description: use ajax to show comments
Version: 1.0
Author: jiangdong
date:2007-04-20
Author URI:http://www.storyday.com
*/
if( !function_exists("cos_get_latest_comments")){
//该函数是获取最新留言,通过查询wp的数据库获取信息,函数命名为cos_主要是防止和别人的插件冲突
function cos_get_latest_comments($no_comments = 5, $before = '
', $show_pass_post = false,$trim_num=20) {
//no_comments 表示取出留言的数量
//$before $after为显示留言的标签
//$trim_num留言最长字符数
global $wpdb, $tablecomments, $tableposts;
$request = "SELECT ID, comment_ID, comment_content, comment_author FROM $tableposts, $tablecomments WHERE $tableposts.ID=$tablecomments.comment_post_ID AND (post_status = 'publish' OR post_status = 'static')";//
if(!$show_pass_post) { $request .= "AND post_password ='' "; }
$request .= "AND comment_approved = '1' ORDER BY $tablecomments.comment_date DESC LIMIT $no_comments";
$comments = $wpdb->get_results($request);
$output = '';
foreach ($comments as $comment) {
$comment_author = stripslashes($comment->comment_author);
$comment_content = strip_tags($comment->comment_content);
$comment_content = stripslashes($comment_content);
$comment_excerpt = utf_substr($comment_content,$trim_num);//utf_substr这个函数是为了截断中文字utf8符串
$permalink = get_permalink($comment->ID)."#comment-".$comment->comment_ID;
$output .= $before . '' .$comment_author . '' . $comment_excerpt . $after;
//这里输出留言
}
$output = "< ?xml version='1.0' encoding='utf-8'?>
- ".$output."
";
header( 'Content-type: text/xml;charset=utf-8' );//将留言用xml格式输出,当然有可能不是合法的xml文件,不过这没有关系
echo $output;
}
}
//
//show latest comments by index.php?action=storyday.showCommentsList
//下面的函数是将函数挂载到wordpress 初始化的钩子上
if( !function_exists("add_cos_cutom")){
function add_cos_cutom(){
if( 'storyday.showCommentsList' == $_GET['action'] ){
//如果get的参数是storyday.showCommentsList即请求是index.php?action=storyday.showCommentsList
//则调用下面的函数,在本例子中,该函数就是显示最新5条留言
//函数调用完毕之后直接终止输出die();
cos_get_latest_comments($no_comments = 5, $before = '
', $show_pass_post = false,30);
die();
}
}
}
add_action('init', 'add_cos_cutom');
//将该函数挂载到init钩子上,各位客官,这下访问index.php?action=storyday.showCommentsList
//就可以看到最新留言的数据流
下面是截断字符串的函数,主要用于正常的uft8编码截断,所以没有放在上面一起,如果你的wp插件库中没有这个函数,请添加到上面的代码中。
if( !function_exists("utf_substr")){
function utf_substr($str,$len){
if( strlen( $str ) < = $len )
return $str;
for($i=0;$i<$len;$i++)
{
$temp_str=substr($str,0,1);
if(ord($temp_str) > 127){
$i++;
if($i< $len) {
$new_str[]=substr($str,0,3);
$str=substr($str,3);
}
}
else {
$new_str[]=substr($str,0,1);
$str=substr($str,1);
}
}
$new_str = join($new_str);
$new_str = $new_str."...";
return $new_str;
}
}
好了,服务器端如何获取留言的插件已经搞定。现在我们就开始考虑如何在客户端处理了。当然,如果你采用了jquery,只需要在模板对应的文件中加上下面的这段代码即可
—-如果你没有使用jQuery 请看下面的代码 ————-
ajax函数代码
利用上面的ajax函数代码获取数据
不知道我有没有说清楚?如果没有,请留言。当然前提条件是你要基本熟悉wordpress的插件机制,如果你不熟悉,或者上面的那个插件你可以用来作为参考。
俗话说,书中自有颜如玉,没有美女怎么行,管她是不是AV女优松岛枫?
标签:ajax, Wordpress
沙发,先占茅坑。