尽管过去了一年多,这个系列还是可以继续的。因为乱梦使然我离开这里,离开技术很久。有时候想,我是不是太高估自己了,很多做不到的事情我想做好,做不好的事情我想做到。就像这博客的评论区……也就止于此吧。在别人评论自己的地方,我想怎样不重要。

把目前用到的东西整理出来,希望能给博友们启发,仅供参考:

一、下拉按钮显示评论

com_arrow.jpg

效果是借鉴mg12的动态加载文章内容,但是没搞懂ajax,所以就成了现在这个样子……还是会加载评论区内容,所以会卡。坚持这个风格的原因很简单,就是我讨厌评论把页面拖得很长,又怕分页影响SEO。

js部分(需要jquery支持):

  1. //下拉式评论区<br />
  2. $(".comment-list").css('display','none');<br />
  3. var expand='<a href="javascript:void(0);" title="隐藏评论" class="expand"></a>';<br />
  4. var collapse='<a href="javascript:void(0);" title="展开评论" class="collapse"></a>';<br />
  5. $('div#comments h4').append(expand);<br />
  6. $('div#comments h4').append(collapse);<br />
  7. $('a.expand').css('display','none');<br />
  8. $('a.collapse').click(function() {<br />
  9. $('.comment-list').slideDown('slow');<br />
  10. $('a.collapse').css('display','none');<br />
  11. $('a.expand').css('display','inline');<br />
  12. $('a.expand').click(function() {<br />
  13. $('.comment-list').slideUp('slow');<br />
  14. $('a.expand').css('display','none');<br />
  15. $('a.collapse').css('display','inline'); })})<br />
  16. });

css部分:

  1. #comments h4 a.expand,<br />
  2. #comments h4 a.collapse {<br />
  3. background:url("images/openicons.gif") 0 -336px no-repeat;<br />
  4. height:16px;<br />
  5. width:16px;<br />
  6. display:block;<br />
  7. text-indent:-999em;<br />
  8. float:right;<br />
  9. }<br />
  10. #comments h4 a.expand {<br />
  11. background-position:0 -320px;<br />
  12. }

好玩的是,很多人看不到会以为没评论。手动广告党们悻悻而去,沙发党却常兴高采烈的坐个屁股墩儿……如果有高手喜欢,希望能研究出ajax加载的效果,默认不显示或只显示前几条评论。这样想看评论的人可以去点开浏览全部,不想看的能享受更快速和简短的页面,岂不两全其美?

二、Done?

com_done.jpg

写完了?——不少博友觉得我这个“防垃圾评论”功能很酷,打个勾确认下才能发表。其实这是从typecho坛友那找来的防君子不防小人之招……仅做js表现没有和程序功能挂钩,意味着spam机器人可以完全无视此框框。所以咳,趣味性的意义更大。至少说明手动广告党们也是很憨的~

修改模板文件comments.php,将评论按钮那句改为:

  1. <!-- 勾选框 --><br />
  2. <div style="clear:both"><input type="checkbox" onclick="agreesubmit(this)" name="agreecheck"/></p><label>Done? </label></div><br />
  3. <!-- 提交按钮 --><br />
  4. <div class="post-button"><input class="submit" name="submit" type="submit" value="<?php _e( 'Submit Comment') ?>" tabindex="7" disabled="disabled" /></div><br />
  5. <!-- js脚本 --><br />
  6. <script type="text/javascript">//<![CDATA[
  7. var checkobj;
  8. function agreesubmit(el){
  9. checkobj=el;
  10. if (document.all||document.getElementById){
  11. for (i=0;i<checkobj.form.length;i++){
  12. var tempobj=checkobj.form.elements[i];
  13. if(tempobj.type.toLowerCase()=="submit")
  14. tempobj.disabled=!checkobj.checked;
  15. }
  16. }
  17. }
  18.  
  19. function defaultagree(el){
  20. if (!document.all && !document.getElementById){
  21. if (window.checkobj && checkobj.checked)
  22. return true;
  23. else{
  24. alert("Say something to continue plz");
  25. return false;
  26. }
  27. }
  28. }
  29. </script><br />
  30. <script type="text/javascript">
  31. document.forms.comment_form.agreecheck.checked=false;
  32. //]]>
  33. </script>

三、小墙判断这是 Spam!

(Last modified: 2011-08-31 16:36)