如何在jqgrid编辑表单中的tinyMCE中捕获Ctrl + S键 [英] how to catch Ctrl+S key in tinyMCE in jqgrid edit form
问题描述
在jqgrid编辑中加入了Ctrl + S和Ctrl + Q键，并使用Oleg很好的答案添加了表单:
Ctrl+S and Ctrl+Q keys are cathed in jqgrid edit and add forms using Oleg great answer:
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元素上
TinyMCE html editor is attached to textarea elements in jqgrid form in afterShowForm event using
$('.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"
});
}
之后，在文本区域中按Ctrl + S会导致出现IE9标准保存对话框.如何也允许Ctrl + S在tinyMCE中保存jqgrid表单?
After that pressing Ctrl+S in textarea causes IE9 standard save dialog to appear. How to allow Ctrl+S to save jqgrid form in tinyMCE also ?
更新
我尝试使用以下代码从答案中推荐. 没有捕获到Keydown事件.
I tried recommendation from answer using code below. Keydown event is not catched.
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"
});
};
Update2
e.这是未定义的.代码
e.which was undefinded. Code
$('.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 主窗口还是其他想法?
catches ctrl+s and ctrl+q. There are also lot of global shortcut keys defined in html keydown event using code below. Those are ignored if tinymce has focus. How to make them to work also. How to call html.keydown in main window or other idea ?
$(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
推荐答案
我不使用 tinyMCE 我自己，但对演示的简短检查显示，tinyMCE使用了<iframe>.如果您还需要在<iframe>内捕获keydown事件，则应该设置其他keydown事件处理程序.对于具有的演示
I don't use tinyMCE myself, but short examine of the demo shows that tinyMCE uses <iframe>. If you need to catch keydown event inside of the <iframe> too you should set additional keydown event handler. For the demo having
<textarea name="content" style="width:100%"></textarea>
<iframe>的ID将在content_ifr中使用.因此，您可以尝试以这种方式构造的id查找<iframe>，或者只是尝试在<span>兄弟姐妹中找到iframe并将其作为iframe的子元素.然后，您可以从<iframe>元素获取.contentWindow.document，并在.contentWindow.document上设置keydown事件处理程序.参见答案和这一个了解更多信息.可能还有其他一些更面向tinyMCE的解决方案，例如此处会更好.因为我自己不使用tinyMCE(请参阅答案的第一句话)，所以我不建议您使用某些特定的方法.
the id of the <iframe> will be used content_ifr. So you can try to find the <iframe> by id constructed in the way or just try to find and child iframe in the <span> sibling to the <textarea>. Then you can get .contentWindow.document from the <iframe> element and set keydown event handler on the .contentWindow.document. See the answer and this one for more information. Probably some other more tinyMCE oriented solution like here would be better. Because I don't use tinyMCE myself (see the first sentence of my answer), I can't recommend you some specific way.
UPDATED: It seems to me now that there are more direct way which provide tinyMCE: onKeyDown.
这篇关于如何在jqgrid编辑表单中的tinyMCE中捕获Ctrl + S键的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
