应用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给博客题目加上页码的办法

本文实例讲述了WordPress给博客题目加上页码的办法。分享给大家供大家参考。详细剖析如下: 很多冤家为了优...

wordpress中文截断产生乱码处理办法

可是严酷的事实是大局部的模板都还是出于老外之手,老内在做模板的时分普通只会思考到显示失常即可,而咱们...

WordPress中使主题支持小工具以及增加插件启用函数

让主题支持小工具 WordPress 的小工具(widget)是一大特征,它让用户自在拖动组合内容,而且任何插件和主题...

wordpress博客搜寻要害词高亮显示完成代码

最近对wordpress的一些小改良很感兴味,能够让你的博客愈加共性,也更风趣味性,上面的代码能够在后果中高亮...

wordpress分类形容支持显示图片的性能完成办法

有的时分,咱们心愿在咱们的分类页面打印分类形容,以此来引见咱们的分类。但在WordPress中,咱们却无奈在分...

WordPress中用于更新伪动态规定的PHP代码实例解说

flush_rewrite_rules() 函数用来删除而后依据现有的条件重写伪动态规定,也就是刷新一次伪动态规定了。 先来...

需求提交

客服服务