应用jQuery完成WordPress中的Ctrl+Enter和@评论回复

增加 Ctrl+Enter 快捷回复
这里送上两种办法,首先是 jQuery 办法,前段工夫不断在钻研 jQuery ,因而对 jQuery 办法比拟相熟,假如你的主题原本曾经加载 jQuery 库,倡议你应用上面的办法。

把这段代码退出 js 文件中,假如你曾经加载 jQuery ,如今就能够应用 Ctrl+Enter 进行快捷回复。

jQuery(document).ready(function($){          
//Ctrl+Enter回复
  jQuery(document).keypress(function(e){
    if(e.ctrlKey && e.which == 13 || e.which == 10) {
      jQuery("#commentform").submit();
    }
  })
});

 
解释一下代码,在 chrome 等古代阅读器中, js 是应用 e.which ==13 判别 Enter ,在 ie6 中, js 是应用 e.which ==10 判别 Enter 。

另一种办法:
在 comments.php 中找到一段相似以下代码(即评论框的代码),

<textarea name="comment" id="comment" rows="10" cols="50" tabindex="4"></textarea>

 
交换为以下的一段代码:

<textarea name="comment" id="comment" rows="10"?cols="50"?tabindex="4" onkeydown="if(event.ctrlKey&&event.keyCode==13 || Key&&event.keyCode==10){document.getElementById('submit').click();return false};"></textarea>

 

完成 Ctrl+Enter 快捷回复的原理跟 jQuery 版的差不多,这里就不作具体解释了。


完成  @回复 
在回复时带有“ @ ”的性能大家应该不生疏了,在微博, BBS 中都能够见到“ @ ”的身影,连腾讯的 Qzone 也退出了“ @回复 ”的性能。确实,“ @回复 ”使到回复的对象愈加明晰了,关于多重回复成果愈加显著。

然而, WordPress 的评论模板中并没有自带这个性能,因而咱们需求手动增加出来,其实这个性能在 WordPress 中曾经比拟盛行了,不少主题中都带有这个性能,完成的原理也有多种,而我在本文中引见的是 jQuery 完成的办法,因为网下流传的文章大多都是间接给出 jQuery 代码,没有具体的解释,而不同的网站 DOM 不肯定相反,因而不相熟 jQuery 的童鞋在应用 jQuery 完成“ @回复 ”时可能会呈现各种成绩。

1.加载 jQuery 库,能够间接用 google 的。

2. jQuery 代码,能够间接放到 js 文件中。

jQuery(document).ready(function($){
$('.comment-reply-link').click(function() {
   //获取回复者的id
   var atid = '"#' + $(this).parent().parent().attr("id") + '"';
   //获取回复者的昵称
  var atname = $(this).parent().find('.comment_author').text();
$("#comment").attr("value","<a href=" + atid + ">@" + atname + " </a>").focus();
});
$('#cancel-comment-reply a').click(function() {
$("#comment").attr("value",'');
});
});

3.解释 jQuery 代码

在完成“ @回复 ”中,要害是获取所要回复的对象的 id 和昵称,因而定义了两个量 atid , atname ,辨别用于保留所要回复的对象的 id 和昵称。当用户用鼠标单击 .comment-reply-link 后jQuery会获取其上两级父元素的 id 属性,保留在量 atid 中,而后在其父元素的子辈元素中寻觅 .comment_author ,并获取其内容保留在 atname 中。或者下面的形容较难了解,上面再用图片阐明一下!

要获取用户 id ,首先需求理解评论局部的 DOM 构造,以 Melody 为例,用 Firebug 查看其一条评论的局部 HTML ,

看了图置信童鞋们应该大略明确了, .comment-reply-link 的上两级父元素蕴含回复者的 id ,因而能够在这里获取回复者的id,而在 .comment-reply-link 的同辈元素中蕴含了用户的昵称,看到这里置信各位童鞋再看看下面的 jQuery 代码应该不难了解了!

咱们首先应该晓得本人的评论模板在哪里有输入回复者的 id ,在哪里有输入回复者的昵称,而后用 jQuery 的抉择器即能够获取相干的数据。

以上就是安达网络工作室关于《使用jQuery实现WordPress中的Ctrl+Enter和@评论回复》的一些看法。更多内容请查看本栏目更多内容!

本文相关话题: jQuery WordPress 回复 JavaScript js
版权声明:本文为 安达网络工作室 转载文章,如有侵权请联系我们及时删除。
相关文章
在WordPress中应用wp_count_posts函数来统计文章数量

做一个全站统计是不是很酷?短暂的博客越来越少,何不给本人的一个统计,看看本人在这个博客上致力了多少,...

基于wordpress主题制造的详细完成步骤

代码如下:<?php/*在根目录 -> wp-content -> themes 下创立mytheme文件夹用来寄存创立新主题模板 在mythem...

Wordpress修正某篇文章ID(把ID为148的改成147)的SQL语句

4月更新过文章,文章ID停留在146,5月忙于考试,文章一篇都没写,后果6月前几天写文章的时分,ID从146间接跳...

WordPress完成黑白标签云的办法

本文实例讲述了WordPress完成黑白标签云的办法。分享给大家供大家参考。详细剖析如下: 黑白标签云咱们在很...

详解WordPress中给链接增加查问字符串的办法

查问字符串指的是链接中后边的问号后的查问语句,格局为 key=value,多个查问语句用 & 符号离开。add_query...

WordPress评论增加楼层显示的办法小结

本文实例总结了WordPress评论增加楼层显示的办法。分享给大家供大家参考。详细剖析如下: 第一步:要在评论...

需求提交

客服服务