wordpress 添加JS，css文件，实现AJAX效果

一，我的问题

我想在wordpress里面添加一个JS文件，实现在一个ajax效果，我在网上找了一个插件，AJAX wordpress发现在不好用，就没有用了。下面我就以本BLOG里面的，收藏和分享为例子。说一下我是怎么添加果文件的。

二，添加JS文件

1），在你要加载JS的那个php文件里面加上这个

<?php wp_enqueue_script(‘jquery’); // 这个是加载，jquery 。must be here, bofore wp_head! ?>

<?php add_action(‘wp_head’, ‘jquery_extend‘); //这个就是我要加的JS文件 ?>

2），在wp-content/themes/你的主题／functions.php里面加个一个方法

function jquery_extend() {
$wp = get_bloginfo(‘wpurl’);
$url = $wp.”/wp-includes/js/jquery/jquery.extend.js”;
print(‘
<script type=”text/javascript” src=”‘.$url.'”></script>
‘);
}

这样在wordpress里面就成功加载了JS了，你可以在firefox里面看一下源码，就可以看到了。如果不加这个FUNCTION的话会报错的。其实你可以在wordpress里面找到这种用法的，如果你有时间的话，

wp-content/themes/default/functions.php里面有一个function kubrick_theme_page_head() 照这个方法抄就行了

三，实现在ajax效果

1）我在我要实现的AJAX效果的那个页面里面添加

<script type=”text/javascript”>
jQuery(“.akst_share_link”).each(function(){
jQuery(this).showneedthing();
});
</script>

注意：这里面不能用$这个符号，这个jquery不识别，为什么呢？因为wordpress自带的jquery.js最后带了这句话jQuery.noConflict();

以下是jquery.extend.js的内容，很简单

(function($){

$.fn.extend({
<span style="color: #800080">showneedthing</span>:function(){

var self = this;

var init = function() {
$(self).click(function() {
$('#akst_social').remove();
array =($(self).attr("needth")).split(',');

ask_id = "akst_link_"+array[0];

$.post("＊＊＊／＊＊＊/<span style="color: #008000">connect.php</span>",{url:array[1],title:array[2]},function(data){
$(data).prependTo($('#'+ask_id).parent());

left = document.getElementById(ask_id).offsetLeft-70;
top =document.getElementById(ask_id).offsetTop+document.getElementById(ask_id).clientHeight-240;

$('#akst_social').css({left:left,top:top}).show();
$('#akst_social').find('a').css("color","blue");
});
});
}
init();
}
});

})(jQuery);

在这里我为什么能用$这个符号呢，因为(function($)我已经重新定义，或者叫负值了一下，你不用$你可用％这个也可以。依个人习惯来设

喜欢 (0)赏

[搞代码]

分享 (0)