应用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中的__()和_e()函数的作用引见

在WordPress 中,__()函数和__e()函数被用来辨认php文件中被标示的、需求被翻译成其它言语或本地化的字符串...

WordPress在线装置主题、插件及疾速公布上传图片时提醒谬误

WordPress在线装置主题、插件,或在应用疾速公布的文章中含有图片时,会提醒: 正在装置主题:Frontier 1.0...

让我据守ZBLOG的十二大理由

要害字形容:理由 ZBLOG 装置 优化 工夫 WordPress 能够 文章 博客   让我据守ZBLOG的十二大理由:   ...

WordPress博客效劳器环境配置

早就想搭建一个专属于本人的博客了,用来记载本人生存、学习的点点滴滴。之所以选WordPress,次要是由于它能...

WordPress 不同分类目录调用不同模板的办法

wordpress不同分类调用不同模板文件 用wordpress做站特地是企业站的时分,多个分类的内容不同需求显示的页面...

需求提交

客服服务