为 WordPress 添加 Ctrl+Enter 快捷回复

时间：2011年9月18日分类：JavaScript , WordPress 标签：jQuery‚ js‚ WordPress‚ 回复评论：65

最近，有些童鞋反映希望 Melody 能添加一个使用 Ctrl+Enter 进行快捷回复的功能。的确，在各大论坛以及我们常用的 QQ 上，都是使用 Ctrl+Enter 快捷键进行回复的，但因为 Kayo 并不常常使用这个功能，因而并没有添加这个功能到 Melody ，而今天心淡若水童鞋再次提醒 Kayo 需要这个功能，于是我马上添加这个功能到 Melody 。

这里送上两种方法，首先是 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 。

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

在 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 版的差不多，这里就不作详细解释了。具体的效果，各位童鞋回复一下本文就知道了！

本文由 Kayo Lee 发表，本文链接：https://kayosite.com/ctrl-and-enter-to-submit.html

你可能也喜欢

评论列表

亨sir
2011-9-18 16:49 回复

这个我主题上有，我就不操这个心了！
哈哈
- Kayo
  2011-9-18 16:57 回复
  
  @亨sir 看来的确是每个主题都需要噢！
心淡若水
2011-9-18 22:18 回复

我先实验下
以前我发的那个很多盆友说不能实现
后台发现原来挺挑主题的
嘿嘿有这个发布信息给力多了
HOHO

晕不行啊
- Kayo
  2011-9-18 23:18 回复
  
  @心淡若水嗯嗯，需要根据自己的模板作适当的修改。
  我测试过，没有问题噢！可能是缓存的问题，强制刷新试试！
  - 心淡若水
    2011-9-21 1:14 回复
    
    @Kayo
    我再次测试验证一下哟西 HOHO
    - Kayo
      2011-9-21 1:27 回复
      
      @心淡若水嘻嘻，缓存更新了就行了！
Yusky
2011-9-19 1:44 回复

一般的主题都带这功能的~~
- Kayo
  2011-9-19 23:54 回复
  
  @Yusky 自己写的主题就得手动添加进去了！
  - Leyar
    2011-9-20 20:04 回复
    
    @Kayo 好佩服能自己些主题的人。。。
    - Kayo
      2011-9-20 22:37 回复
      
      @Leyar 练一练，你也可以的~
Demon
2011-9-19 20:17 回复

现在的主题都会带上这功能了。
- Kayo
  2011-9-19 23:55 回复
  
  @Demon 自己写的主题得折腾进去了！
- 无冷
  2011-9-23 12:31 回复
  
  @Demon 给提交绑定个按键滚轮提交估计也许
  - Kayo
    2011-9-23 15:46 回复
    
    @无冷这个还真是第一次听到，是用鼠标中键提交吗？
kencue
2011-9-19 20:58 回复

新功能喔！但系点解唔得噶？
- Kayo
  2011-9-19 23:55 回复
  
  @kencue WP Super Cache 的缓存影响，强制刷新！
Leyar
2011-9-20 20:03 回复

还可以加一个 ALT+S的快捷回复～～嘿嘿。
- Kayo
  2011-9-20 22:58 回复
  
  @Leyar 刚刚才知道qq上有这个快捷键，我惭愧了
  - Leyar
    2011-9-20 23:37 回复
    
    @Kayo QQ上我习惯性的Enter快捷键。嘿嘿，睡觉啦，晚安～～
    - Kayo
      2011-9-20 23:43 回复
      
      @Leyar 我QQ上用的也是Enter，第一次用QQ时就改成Enter了，感觉比较顺手。不过貌似不少童鞋都是Ctrl+Enter回复，Enter换行。。
      晚安，Leyar
Leyar
2011-9-20 20:05 回复

我觉得还可以在加一个ajax 的无刷新评论功能。这样，提交之后还可以继续修改。
- Kayo
  2011-9-20 23:01 回复
  
  @Leyar 其实已经添加了Ajax评论，只是关闭了提交后再编辑的功能！
  - Leyar
    2011-9-20 23:21 回复
    
    @Kayo 喔。。如此如此。。这般这般。。。
    - Kayo
      2011-9-20 23:23 回复
      
      @Leyar 嗯嗯，正是正是！
      - Leyar
        2011-9-20 23:28 回复
        
        @Kayo 那为啥要去掉那个功能呢？挺好的呀。。（其实主要是。。我老打错字。。）
        
        Kayo
        2011-9-20 23:31 回复
        
        @Leyar 其实是否取消这个功能也让我纠结了一会，摘自我上一篇文章——这个功能的原意是让那些不小心打错字的童鞋有机会更正，但在使用了一段时间后，我发现了我评论时没有那么专心了，因为打错了可以再编辑，我觉得这个功能破坏了评论的即时感觉，大概评论就是这样，一开始的最能一针见血，哪怕不小心出现了错字！
        
        Kayo
        2011-9-20 23:32 回复
        
        @Leyar 话说我也常打错字，所以不排除上面的那大段字会有错字噢
        
        Leyar
        2011-9-20 23:35 回复
        
        @Kayo 喔，。。原来如些。不过说得也有道理，一开始说的往往都是最真实的想法，然后发表了之后回头一看，总是习惯性的涂涂改改，尽量修饰措辞什么的，就失掉了原汁原味了。哈～不过嘛，虽说是这样，还是比较喜欢可以编辑的。。没办法。。拼音输入法太不知能了，而我打字又总是不仔细看。。囧。。
        
        Kayo
        2011-9-20 23:39 回复
        
        @Leyar 看到一些这么详细的回复，写文章又有动力了，哈哈，其实打错字也没关系吧，我会看懂的！
进口红酒
2011-9-21 14:56 回复

js文件在哪啊
yequnai
2011-9-21 18:57 回复

真噶喔，好神奇啊~~
yequnai
2011-9-21 18:59 回复
Ben
2011-9-22 20:46 回复

:lol: 从第一次用QQ开始我就改成Enter发消息。
- Kayo
  2011-9-22 21:52 回复
  
  @Ben 我也是第一次用QQ时就改成Enter了，比较顺手。不过貌似不少童鞋都是Enter换行，Ctrl+Enter发消息。
无冷
2011-9-23 12:30 回复

这主题是有点想走轻博客的影子
- Kayo
  2011-9-23 15:45 回复
  
  @无冷其实只是主题比较简洁，我专注的还是独立博客的形式！
su
2011-9-23 19:18 回复

哈哈我也来看看你了啊
- Kayo
  2011-9-23 22:40 回复
  
  @su 嘻嘻，谢谢小苏子！
win8迷
2011-9-23 22:29 回复

已经有了呢
- Kayo
  2011-9-25 19:16 回复
  
  @win8迷哈哈，有了就不用折腾了。
  Ps.奇怪，怎么你的回复被Akismet拦截了~
先看看
2011-9-24 11:23 回复

这个还挺实用的
- Kayo
  2011-9-24 23:32 回复
  
  @先看看嗯嗯，现在用了几天这个功能，灰常好用！

1 2 »