jQuery实现页面评论栏中访客信息自动填写功能的方法(jquery fullpage)

编辑：rootadmin

推荐整理分享jQuery实现页面评论栏中访客信息自动填写功能的方法(jquery fullpage)，希望有所帮助，仅作参考，欢迎阅读内容。

文章相关热门搜索词:jquery页面布局,jquery页面跳转的方法,jquery网页,jquery网页设计,jquery设置html,jquery fullpage,jquery网页制作,jquery网页设计,内容如对您有帮助，希望把文章链接给更多的朋友！

首先简单说一说仿登陆的具体操作，用户第一次登陆时会出现用于填写评论者资料的框，当用户评论完成后，将会以 cookie 的方式记录评论者资料，一年后 cookie 自动清除，当用户再次评论时填写评论者资料的 div 将会隐藏，当用户点击“ Change ”时可以再次编辑评论者资料，同时 Change 字样会改为“ Finish ” ，点击 Finish 时填写评论者资料的 div 将会再次隐藏，同时 Change 字样将会改为 Change Again 。

以下是分步叙述如何使用 jQuery 实现以上效果，如果只想实现效果的童鞋可以直接看代码。

1.加载 jQuery 库，这是必须的。

2.把 comments.php 的评论者资料框代码和评论框代码按如下修改：

在上面的代码中，会以 cookie 的方式记录评论者资料，并把评论者资料框的 div 赋予“ hidden ”的 class ，因此对于曾评论的访客，需要先隐藏起评论者资料框的 div ，可以使用 jQuery 的hide()事件隐藏该 div ，如果 jQuery 加载速度较慢，会出现打开页面时先出现 div ，片刻后再突然隐藏 div 的情况，这样显然不利用户体验，因此也可以直接写一条 css ——.hidden {display: none; }。

3.然后再使用toggle()事件，slideUp()和slideDown()动画实现编辑评论者资料的功能。

jQuery实现页面评论栏中访客信息自动填写功能的方法(jquery fullpage)

4.为了提高用户体验，还需要使用text()方法在点击“Change”时把 Change 的字样改为“ Finish ”，当点击 Finish 时再把 Finish 字样改为“ Change Again ”。把以上代码整合，完整的 jQuery 代码如下：

PS：访客评论显示欢迎信息我们通过判断$comment_author变量值是否为空，来确定访客是否在近期有评论（有 Cookie）。

如果有，则在评论框上方显示欢迎信息：

以上代码，需要添加到主题的 comment.php 文件 comment_form($comments_args) 方法调用之前。

接下来，我们通过 Javascript 来实现访客信息更改：

这样，如果用户需要更新信息时，可以点击欢迎信息右侧的更改按钮；修改完成之后，用户信息会在评论后更新。

jQuery Mobile中的button按钮组件基础使用教程一.Button组件及jQueryMobile如何丰富组件样式在jQueryMobile里，可以通过给任意链接添加data-role=button来产生一个button组件，jQueryMobile会追加一定的样式到链接

AJAX实现瀑布流触发分页与分页触发瀑布流的方法所谓的瀑布流效果就正如轻图床首页效果那样，多个内容相近的栏目紧密排列，尽量使到栏目间的间隙最小（即流体布局），并且随着页面滚动条向下

jQuery height()、innerHeight()、outerHeight()函数的区别详解在jQuery中，获取元素高度的函数有3个，它们分别是height()、innerHeight()、outerHeight()。与此相对应的是，获取元素宽度的函数也有3个，它们分别是width()、i