我们如果要静态化wordpress得页面时,就必须对一些动态的信息进行ajax异步加载,现在js框架比较流行的jQuery所以本文也是讲的ajax也是使用jQuery的技术。
如果你对jQuery不了解可查看他的官网:http://jquery.com/或者查看jQuery教程:http://www.w3school.com.cn/jquery/
1、接下来我们在我们的主题的js文件中加入如下代码:
(function($) {
$.ajax({
url: 'http://www.shouce.ren/?action=ajax', //域名换成你要用的
type: 'get',
beforeSend: function() {
var loading = '<span class="loadsidebar"></span>';
$('#body').empty().html(loading) //显示loading
},
error: function(a) {
$('body').hide().empty().html('<div style="text-align:center;padding-top:20px;">还木有载好</div>').fadeIn('fast')
}, //错误时输出
success: function(a) {
$('body').empty().html(a) //成功时输出神马
}
});
})(jQuery);
本地代码加载js文件后直接调用,你也可以使用鼠标移过事件hover或者click事件来触发ajax请求。
2、在我们主题的functions.php文件中添加如下代码:
function ajax_load(){
if( isset($_GET['action'])){
if($_GET['action'] == 'ajax' ){
echo '我是异步获取的'; //你可以根据需要输出,比如输出最新评论,最新文章,最新热门文章等。
exit;
}
}
}
add_action('init', 'ajax_load');
代码解释:wordpress在初始化时调用ajax_load函数。