如何在 jqgrid 编辑表单中捕获 tinyMCE 中的 Ctrl+S 键

Question

Ctrl+S 和 Ctrl+Q 键包含在 jqgrid 编辑中，并使用 Oleg 很好的答案添加表单：

beforeShowForm: function ($form) {
  var gridIdEncoded = $.jgrid.jqID($form[0].id.substring(8));
  $("#editmod" + gridIdEncoded).bind('keydown.formEvent', function (e) {
    if (e.ctrlKey && e.which === 83) {
      $("#TblGrid_" + gridIdEncoded + "_2 #sData").trigger("click");
      return false;
      }
    if (e.ctrlKey && e.which === 81) {  // ctrl-q
                   $("#TblGrid_" + gridIdEncoded + "_2 #cData").trigger("click");
                   return false;
                   }
}

TinyMCE html 编辑器使用 afterShowForm 事件附加到 jqgrid 表单中的 textarea 元素

    $('.htmleditor', formSelector).attr('cols', '50').attr('rows', '15').tinymce({
        theme: "advanced",
        language: "et",
        theme_advanced_buttons2: "",
        theme_advanced_buttons3: "",
        theme_advanced_buttons1: "bold,italic,underline,strikethrough,separator,justifyleft,justifycenter," +
"justifyright,justifyfull,|,bullist,numlist,|,outdent,indent,|,cut ,copy,paste,undo,redo" +
"link,unlink,image,cleanup,code,hr,|,removeformat,formatselect,|,fontselect,fontsizeselect," +
"sub,sup,|,forecolor,backcolor,forecolorpicker,backcolorpicker,charmap,visualaid," +
"anchor,blockquote"
    });
}

在 textarea 中按 Ctrl+S 后会出现 IE9 标准保存对话框。如何让 Ctrl+S 也可以在 tinyMCE 中保存 jqgrid 形式？

更新

我尝试使用下面的代码从答案中推荐。 未捕获 Keydown 事件。

afterShowForm: function (formSelector) {
        $('.htmleditor', formSelector).attr('cols', '50').attr('rows', '15').tinymce({
            setup: function (ed) {
                ed.onKeyDown.add(function (ed, e) {
                    // this box happens: alert('setup binding');
                    var gridIdEncoded = $.jgrid.jqID(formSelector[0].id.substring(8));
                    $("#editmod" + gridIdEncoded).bind('keydown.formEvent', function (e) {
                        alert('in keydown'); // this does not happen
                        if (e.ctrlKey && e.which === 83) {
                            $("#TblGrid_" + gridIdEncoded + "_2 #sData").trigger("click");
                            return false;
                        }
                        if (e.ctrlKey && e.which === 81) {  // ctrl-q
                            $("#TblGrid_" + gridIdEncoded + "_2 #cData").trigger("click");
                            return false;
                        }
                    });
                });
            },

            theme: "advanced",
            language: "et",
            theme_advanced_buttons2: "",
            theme_advanced_buttons3: "",
            theme_advanced_buttons1: "bold,italic,underline,strikethrough,separator,justifyleft,justifycenter," +
    "justifyright,justifyfull,|,bullist,numlist,|,outdent,indent,|,cut ,copy,paste,undo,redo" +
    "link,unlink,image,cleanup,code,hr,|,removeformat,formatselect,|,fontselect,fontsizeselect," +
    "sub,sup,|,forecolor,backcolor,forecolorpicker,backcolorpicker,charmap,visualaid," +
    "anchor,blockquote"
        });
    };

更新2

e.which 未定义。代码

$('.htmleditor', formSelector).attr('cols', '50').attr('rows', '15').tinymce({
    setup: function (ed) {
        ed.onKeyDown.add(function (ed, e) {
            var gridIdEncoded = $.jgrid.jqID(formSelector[0].id.substring(8));
            if (e.ctrlKey && e.keyCode === 83) {
                $("#TblGrid_" + gridIdEncoded + "_2 #sData").trigger("click");
                return false;
            }
            if (e.ctrlKey && e.keyCode === 81) {
                $("#TblGrid_" + gridIdEncoded + "_2 #cData").trigger("click");
                return false;
            }
        });
    },

捕获 ctrl+s 和 ctrl+q。 使用下面的代码在 html keydown 事件中定义了许多全局快捷键。 如果 tinymce 有焦点，这些将被忽略。如何使它们也起作用。如何调用 html.keydown 主窗口或其他想法？

$(function () {
    $("html").keydown(function (evt) {
        var elem = evt.target || evt.srcElement;
        if (evt.ctrlKey) {
            switch (evt.keyCode) {
                case 68: openWindow('ToodeL'); return false;
                case 69: openWindow('DoklstlG'); return false;
... lot of openWindow calls

Answer 1

我自己不使用tinyMCE，但对the demo 的简短检查表明tinyMCE 使用<iframe>。如果您还需要在<iframe> 中捕获keydown 事件，则应设置额外的keydown 事件处理程序。对于演示有

<textarea name="content" style="width:100%"></textarea> 

<iframe> 的 id 将用于content_ifr。因此，您可以尝试通过构造方式查找<iframe>，或者尝试在<span> 的<textarea> 的兄弟姐妹中找到iframe 的子代。然后您可以从<iframe> 元素中获取.contentWindow.document 并在.contentWindow.document 上设置keydown 事件处理程序。有关详细信息，请参阅 the answer 和 this one。可能像here 这样的其他一些更面向tinyMCE 的解决方案会更好。因为我自己不使用tinyMCE（见我回答的第一句话），所以不能给你推荐一些具体的方法。

已更新：在我看来，现在有更直接的方式可以提供 tinyMCE：onKeyDown。