应用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应用外链图片作为文章缩略图的办法

1、要有一个确定图片地址的办法:文章中的第一张图片,或许应用自定义栏目添加一个自定义值。2、在前台调用...

WordPress博客效劳器环境配置

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

WordPress中用于获取及自定义头像图片的PHP脚本详解

get_avatar()(获取头像) get_avatar() 函数用来获取置顶邮箱或许用户的头像代码,在评论列表中十分罕用。...

Dreamweaver代码的格局化性能掌控html代码的格局

明天偶尔发现了Dreamweaver的一个十分有用的性能,就是代码的格局化性能。普通状况下,咱们写的html或许css...

优化WordPress数据库晋升网站运转速度

WordPress的文章、评论等很少数据都是寄存在数据库的,所以搭建wordpress网站的工夫,网站的空间不需求多大...

需求提交

客服服务