Javascript 制作TinyMCE+；按下ctrl+后提交表格；s

更新日期：2011年5月13日

请在我下面的答案中找到解决方案

---

更新日期：2011年5月5日

所以现在的问题是，我想在按下Ctrl+S后调用JetTable submit按钮。伟大的Thariama已经为TinyMCE显示了Ctrl+S部分，所以现在我必须弄清楚如何让JEditable提交

按下Ctrl+S后，我试图找到submit按钮，并按。不起作用

以下是我的表格初始化相关代码：

    //Edit Note
$(function(){
   $(".edit").editable('ajax/save.php?editnotetext', {
      type : 'mce',
      submit : '<button class="save_button">Save</button>',
      cancel: 'Cancel',
      event: 'dblclick',
      indicator : 'Saving...',
      tooltip : 'Doubleclick to edit...',
      onblur: 'ignore',
      width : '700px',
      height : '100px'
   });
});

任何想法都欢迎

---

2011年4月28日

将TinyMCE与表一起使用（根据）。编辑完我的内容后，我想按Ctrl+S进行提交。不幸的是，没有提交任何内容，我只剩下我的原始内容。如果我按“提交”按钮，它确实可以工作

我试过：

$(function(){
    $(".edit").keypress(function(event) {
        if ((event.which == 115 && event.ctrlKey)){
            alert("you pressed ctrl-s!");
            $(this).submit();
        }
    });


   $(".edit").editable('ajax/save.php?editnotetext', {
      type : 'mce',
      submit : 'save',
      cancel: 'cancel',
      indicator : 'Saving...',
      tooltip : 'Click to edit...',
      onblur: 'ignore',
      width : '500px',
      height : '100px'
   });
});

---

看看这些用于创建键盘快捷键的jquery插件。这可能就是你想要的

---

这是一件有点特殊的事情。这里的问题是tinymce（以及每个强大的rte）使用iframe来编辑内容。这导致了一个问题，即当iframe具有焦点时，iframe将“捕获”所有键盘事件。我将向你展示我如何解决这个问题

在tinymce init（或一个插件）中，您需要设置以下内容

// 83 instead of 73 as keyCode here !!!!!!!!
setup : function(ed) {
 ed.onKeyDown.add(function(ed, evt) {

    // catch crtl+s, use receiveShortCutEvent in the html-document
  if (evt.keyCode == 83 && evt.ctrlKey && !evt.shiftKey && !evt.altKey && !evt.metaKey) {
    setTimeout(function(){
      var e = { type : 'keydown'};
      e.charCode = e.keyCode = e.which = 83;
      e.shiftKey = e.altKey = e.metaKey = false;
      e.ctrlKey = true;
      window.parent.receiveShortCutEvent(e); // !!! delegate created event object
    }, 1);
  }
 });
},

在html文档（或包含的js文件）中，您需要设置

// init in the main document
// Keydown events on the main document will call receiveShortCutEvent
$(document).bind('keydown', function(e)
{
    var handled = receiveShortCutEvent(e); 
    return !handled;
});

您还需要在此处定义要为哪个快捷方式执行的操作

var receiveShortCutEvent = function(e)
{
  if (e.ctrlKey){
    //console.log('e.keyCode:',e.keyCode);
    var handled = true; // default case set this to false which lets the browser execute a browsershortcut if existent
    switch (e.keyCode){   // be careful that keyCode may differ in browsers sometimes 
      case 83 : 
          alert("you pressed ctrl-s!");
          break;

      default : handled = false;
  }
}

---

解决方案1：不使用TINYMCE

如果你没有将TinyMCE与JEditable一起使用，请查看Arman p.在上的帖子

解决方案2：使用TINYMCE

正如Thariama指出的，Tinymce使用iframe来编辑内容。这导致了一个问题，即当iframe具有焦点时，iframe将“捕获”所有键盘事件。因此，您需要修改tinymce定制

首先是在表初始化中，给save按钮一个类，我们称之为“save_button”：

---

嗨，洛里扎克。这可能会有所帮助，但不幸的是，真正的问题是TinyMCE/JEditable，因为我不确定脚本到底发生了什么，也没有足够的技术能力来解决它。例如，一个人如何将Ctrl+S键“绑定”到JEditable创建的submit按钮上？它看起来非常可爱，将秘密地将其添加到一个项目中，让他们大吃一惊！谢谢塔里亚马。我对最后一部分有疑问。我可以把它放在第二个代码后面吗？如果我这样做，我的js就不起作用了。我还尝试了

$（document）.ready（函数receiveShortCutEvent（e）{

。所有其他的javscript都可以工作，但Ctrl+S不能。你有没有在receiveShortCutEvent函数中添加一个警报来查看该函数是否被调用？我编辑了我的帖子，看起来里面仍然有一个旧的键码（72而不是83）你好，Thariama。警报现在被调用，但没有提交任何内容。是否有一行代码我应该“取消注释”？谢谢你的帮助。

var receiveShortCutEvent = function(e)
{
  if (e.ctrlKey){
    //console.log('e.keyCode:',e.keyCode);
    var handled = true; // default case set this to false which lets the browser execute a browsershortcut if existent
    switch (e.keyCode){   // be careful that keyCode may differ in browsers sometimes 
      case 83 : 
          alert("you pressed ctrl-s!");
          break;

      default : handled = false;
  }
}

    $(".edit").editable('ajax/save.php?editnotetext', {
        type : 'mce',
        submit : '<button class="save_button">Save</button>',
        ...
    });

   tinyMCE.init({
    ...
    setup : function(ed) {
     ed.onKeyDown.add(function(ed, evt) {
        // catch crtl+s, use receiveShortCutEvent in the html-document
        if (evt.keyCode == 83 && evt.ctrlKey && !evt.shiftKey && !evt.altKey && !evt.metaKey) {
           evt.preventDefault();
           $('.save_button').submit();
       }
     });
   }

  });