
自从成功使用 JQuery 实现伪异步载入后,也就消除了我对 JQuery 莫名的心理障碍,对 JQuery 的兴趣也是与日俱增,现在发现用 JQuery 不但可以实现很多酷炫的效果,而且对提高访客体验也是很有帮助的。不过话说,自从给自己的 Wordpress 引入 JQuery 后,测试数据证明我曾引以为傲的网站速度略有迟缓,为了更好的访客体验,增加更多的回头率,只好稍微牺牲一下速度,尽力在网站效果和速度之间找到一个平衡点,使之完美。
昨天就给自己的 Wordpress 添加了记录访客 Cookies,并隐藏评论者昵称、邮箱、网址等个人信息的功能,这样可以让第二次回访的用户在留言时看上去如同管 理员登陆时的状态一样。网上参考了不少博文和资料,最后还是选择了 Leo.N 的方法,虽说他也是从别处挖来的,但是 Leo.N 写的很仔细,适合我这样的 JQuery 小白,拿来转载一下。
首先,我们要编辑 comments.php,在类似于:
在评论者姓名输入框代码上方添加:
<div id="welcome">
<?php printf(__('欢迎 <strong>%s</strong> 归来! '), $comment_author) ?>
</div>
<?php endif; ?>
然后再把三个评论者姓名、电邮、网址的代码输入框用 <div id="author_info"></div>包起来,到此,comments.php 修改结束;
然后,新建一个名为 infohide 的 js 文件,把以下代码放进去:
if($('input#author[value]').length>0){ //判断用户框是否有值
$("#author_info").css('display','none'); //将id为author_info的对象的display属性设为none,即隐藏
var change='<span id="show_author_info" style="cursor: pointer; color:#2970A6;">change »</span>'; //定义change,style是定义CSS样式,让他有超链接的效果,color要根据你自己的来改,当然你也可以在CSS中定义#show_author_info来实现,这样是为了不用再去修改style.css而已!
var close='<span id="hide_author_info" style="cursor: pointer;color: #2970A6;">close »</span>'; //定义close
$('#welcome').append(change); //在ID为welcome的对象里添加刚刚定义的change
$('#welcome').append(close); // 添加close
$('#hide_author_info').css('display','none'); //隐藏close
$('#show_author_info').click(function() { //鼠标点击change时发生的事件
$('#author_info').slideDown('slow'); //用户输入框向下滑出
$('#show_author_info').css('display','none'); //隐藏change
$('#hide_author_info').css('display','inline'); //显示close
$('#hide_author_info').click(function() { // 鼠标点击close时发生的事件
$('#author_info').slideUp('slow'); //用户输入框向上滑
$('#hide_author_info').css('display','none'); //隐藏close
$('#show_author_info').css('display','inline'); })})}}) //显示change
保存文件至主题目录下。
最后,在 footer.php 中引用 JQuery 和以上 infohide.js:
<?php if ( is_singular() ){ ?>
<script type="text/javascript" src="<?php bloginfo('template_url'); ?>/infohide.js"></script>
<?php } ?>
友情提醒:载入 JQuery 和 JS 的顺序一定不能搞错,否则就不成功了。至此,用 JQuery 隐藏回头访客资料输入框就完成了,童鞋快留言试试吧!
方法载自:http://leo-n.cn/hide-visitor-info-with-jquery.html


。。。。你学的真快
目前还不会JQuery……
试试看哈,不知道什么样子
现在试试……
- -好像我的主题注定不支持很多东西。郁闷
能显示欢迎。但不能隐藏那三个文本框。。奇怪了,
可能是comments.php里写错了吧
今天晚上我和张三又测试了!不过还是失败了!唉!好郁闷!明天我和张三一起找你问问,我们两个都无能为力了!
可否加友情链接?经常在WP看到你,不过这篇文章是google搜到的
非常感谢,但是小站一般不接受初次来访的友链,欢迎常来,可以把友链建立在友情的基础上,望理解~
没关系。不过我可不是初次来访。当时在WP论坛询问你页面的文字阴影效果你还回帖了
哦,那我还真没见过你!
我想请问下,有没有博客主题自带这种功能?
好多主题都带这个功能,比如说MG12的
技术博客,非常好的创意,我在其他博客上也看到过有人在用。
有些主题自带这个功能,我更喜欢自己折腾上去,有成就感,嘿嘿
学习了 收藏着
只要加载了JQ,这个方法还是很值得一试的
JQuery 是挺好。只可惜我学不会。
我也学不会,只会抄现成的,呵呵
呵呵,谢谢,是个很人性化的方法,希望你也能用上吧
给我狠狠地隐藏 呵呵
呵呵,对于IE的用户就很方便,因为IE不会自动记录cookies的吧?
你卖出的广告位是右边那个主机广告?
不是,右边的是我免费给朋友做的AD,卖出的广告位是每篇日志正文中的AD
啊!哈~~~~~~~~~~`咋一看还以为是Google提供的广告!!所以也就不注意了.
我还没玩过Google adsense,GG的钱不好赚
和松松一个等级的博客~~就是照顾新人不够~~肯定是很忙 哈哈~~
松松已经是个神话了,不可逾越~
哈哈 过度谦虚可不好哦。。
又是一个名博!
名博在哪里?你不会是说我的吧?
老万,有个问题请教
我看见你在文章正文的超级链接都加上了CSS样式.
我也想加,但是在CSS设定后会对文章内的图片造成影响.
或者你可以告诉我如何让文章插入的图片不变成超级链接?
可以把图片和文字链接分开定义啊
呃CSS我正在用Firefox看,但是我发现你文章内部的图片都不是超级链接形式哎,有设置还是每次发文的时候都手动取消的?
不用取消,我在发布日志的时候,就没有给图片设置链接呢