记录并隐藏 WordPress 评论者信息

万戈 2009.12.06 发布于：电脑网络, 转来载去 5,702 次践踏

自从成功使用 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

与

记录并隐藏 WordPress 评论者信息

jQuery,JS,WordPress,留言