记录并隐藏 WordPress 评论者信息

发布于：电脑网络, 转来载去 5,703 次践踏

自从成功使用 JQuery 实现伪异步载入后，也就消除了我对 JQuery 莫名的心理障碍，对 JQuery 的兴趣也是与日俱增，现在发现用 JQuery 不但可以实现很多酷炫的效果，而且对提高访客体验也是很有帮助的。不过话说，自从给自己的 WordPress 引入 JQuery 后，测试数据证明我曾引以为傲的网站速度略有迟缓，为了更好的访客体验，增加更多的回头率，只好稍微牺牲一下速度，尽力在网站效果和速度之间找到一个平衡点，使之完美。

昨天就给自己的 WordPress 添加了记录访客 Cookies，并隐藏评论者昵称、邮箱、网址等个人信息的功能，这样可以让第二次回访的用户在留言时看上去如同管 理员登陆时的状态一样。网上参考了不少博文和资料，最后还是选择了 Leo.N 的方法，虽说他也是从别处挖来的，但是 Leo.N 写的很仔细，适合我这样的 JQuery 小白，拿来转载一下。

首先，我们要编辑　comments.php，在类似于：

<input type="text" name="author" id="author" value="<?php echo $comment_author; ?>" size="22" tabindex="1"/>

在评论者姓名输入框代码上方添加：

<?php if ( $comment_author != "" ) : ?>
<div id="welcome">
<?php printf(__('欢迎 <strong>%s</strong> 归来！ '), $comment_author) ?>
</div>
<?php endif; ?>

然后再把三个评论者姓名、电邮、网址的代码输入框用 <div id="author_info"></div>包起来，到此，comments.php 修改结束；

然后，新建一个名为 infohide 的 js 文件，把以下代码放进去：

$(document).ready(function() { //开始
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 &raquo;</span>'; //定义change，style是定义CSS样式，让他有超链接的效果，color要根据你自己的来改，当然你也可以在CSS中定义#show_author_info来实现，这样是为了不用再去修改style.css而已！
var close='<span id="hide_author_info" style="cursor: pointer;color: #2970A6;">close &raquo;</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：

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.2.6/jquery.min.js"></script>
<?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