wordprees使支持快捷评论Ctrl+Enter教程

nimaboke 2015-8-23 2965

经常逛论坛、聊QQ的朋友都习惯CTRL + Enter来发送消息,可惜WordPress没有内置这个功能,我们可以通过添加代码的方式来实现 Ctrl+Enter 快捷回复功能,来提高网站的用户体验度。

这里送上两种方法,首先是 jQuery 方法,前段时间一直在研究 jQuery ,因此对 jQuery 方法比较熟悉,如果你的主题本来已经加载 jQuery 库,建议你使用下面的方法。

 

把这段代码加入 js 文件中,如果你已经加载 jQuery ,现在就可以使用 Ctrl+Enter 进行快捷回复。
[code lang="js"]jQuery(document).ready(function($){
//Ctrl+Enter回复
jQuery(document).keypress(function(e){
if(e.ctrlKey && e.which == 13 || e.which == 10) {
jQuery("#commentform").submit();
}
})
});[/code]
 

解释一下代码,在 chrome 等现代浏览器中, js 是使用 e.which ==13 判断 Enter ,在 ie6 中, js 是使用 e.which ==10 判断 Enter 。

 

另一种方法是使用原生的 js ,在 Kayo 学习 jQuery 后,对原生 js 也产生了兴趣,于是上网订购了一本《JavaScript权威指南》,话说这书竟然有 900 多页,虽然有 300 多页是附录,但要看完也不容易, Kayo 当然不会全部看完才实践啦,于是利用一点 js 知识,折腾了 Ctrl+Enter 回复的 js 版,如果你的网站本来没有加载 jQuery 库,使用以下方法就比较方便。

 

在 comments.php 中找到一段类似以下代码(即评论框的代码),
[code lang="css"]<textarea name="comment" id="comment" rows="10" cols="50" tabindex="4"></textarea>[/code]
 

替换为以下的一段代码:
[code lang="css"]<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>[/code]

实现 Ctrl+Enter 快捷回复的原理跟 jQuery 版的差不多,这里就不作详细解释了。具体的效果,各位童鞋回复一下本文就知道了!
最新回复 (0)