Javascript 替代Tinymce中的快捷方式指定
我在一个显示html文档并允许用户对其进行注释的应用程序中使用Tinymce 我已经创建了许多插件,并将自己的快捷方式附加到插件上。我还创建了自己的粗体、斜体和下划线处理程序,方法是在tinymce javascript中注释掉赋值并创建自己的处理程序 然而,有一些捷径,我似乎不能使用 我正在使用addShortcut调用。例如,无论我如何尝试覆盖,CTRL-O都会显示一个标准的“文件打开”窗口。我可以指定CTRL-SHIFT-O,这很好 我还希望能够覆盖浏览器使用的快捷方式的默认行为,如CTRL-R刷新。我们的主要用户非常喜欢使用键盘快捷键,并且担心他会意外地按CTRL-R键,这可能会刷新页面并丢失未保存的工作 有没有办法在CTRL-R进入浏览器之前覆盖或拦截它Javascript 替代Tinymce中的快捷方式指定,javascript,tinymce,keyboard-shortcuts,tinymce-4,Javascript,Tinymce,Keyboard Shortcuts,Tinymce 4,我在一个显示html文档并允许用户对其进行注释的应用程序中使用Tinymce 我已经创建了许多插件,并将自己的快捷方式附加到插件上。我还创建了自己的粗体、斜体和下划线处理程序,方法是在tinymce javascript中注释掉赋值并创建自己的处理程序 然而,有一些捷径,我似乎不能使用 我正在使用addShortcut调用。例如,无论我如何尝试覆盖,CTRL-O都会显示一个标准的“文件打开”窗口。我可以指定CTRL-SHIFT-O,这很好 我还希望能够覆盖浏览器使用的快捷方式的默认行为,如CTR
提前感谢您的帮助。我在StackOverflow上的另一篇文章中找到了解决这个问题的方法,它让我可以完全控制所有击键,并让我可以轻松捕获任何想要的快捷方式。这成功地覆盖了用于刷新的CTRL-R和用于打开的CTRL-O。 我对示例代码做了一些修改,但非常感谢hims056提供的解决方案。他的回答以及其他一些有用的例子可在以下网址找到: 以下是我的代码版本:
tinymce.init({
selector: "textarea#elm1",
theme: "modern",
statusbar: false,
width: "100%",
height: "95%",
plugins: ["print preview"],
content_css: "css/content.css",
...
setup: function(ed)
{
ed.on("keyup", function(e) {
console.debug('Key up event: ' + e.keyCode);
overrideKeyboardEvent(e);
});
ed.on("keydown", function( e) {
console.debug('Key down event: ' + e.keyCode);
overrideKeyboardEvent(e);
});
<script type="text/javascript">
document.onkeydown = overrideKeyboardEvent;
document.onkeyup = overrideKeyboardEvent;
var keyIsDown = {};
function overrideKeyboardEvent(e){
var returnVal = true;
switch(e.type){
case "keydown":
if(!keyIsDown[e.keyCode]){
keyIsDown[e.keyCode] = true;
// check if they selected ctrl-r which will refresh the screen
if (keyIsDown[17])
{
switch (e.keyCode)
{
case 82: // CTRL-R refreshes the screen! Don't want to do that!
e.stopPropagation();
e.preventDefault();
returnVal = false; // false means don't propagate
break;
case 79: // CTRL-O by default opens an open File Dialog.
e.stopPropagation();
e.preventDefault();
returnVal = false; // false means don't propagate
// call openDocument
loadDocument(false);
break;
case 68: // CTRL-D by default opens up the Bookmark Editor in Chrome. We want to start a comment!
e.stopPropagation();
e.preventDefault();
returnVal = false; // false means don't propagate
createComment();
break;
}
}
}
break;
case "keyup":
delete(keyIsDown[e.keyCode]);
// do key up stuff here
break;
}
return returnVal;
}
tinymce.init({
选择器:“textarea#elm1”,
主题:“现代”,
状态栏:false,
宽度:“100%”,
身高:“95%”,
插件:[“打印预览”],
content\u css:“css/content.css”,
...
设置:功能(ed)
{
ed.on(“键控”,功能(e){
console.debug('Key up event:'+e.keyCode);
超越董事会事件(e);
});
开启(“按键”,功能(e){
console.debug('Key down event:'+e.keyCode);
超越董事会事件(e);
});
document.onkeydown=overrideKeyboardEvent;
document.onkeyup=overrideKeyboardEvent;
var keyIsDown={};
函数overrideKeyboardEvent(e){
var returnVal=true;
开关(e型){
案例“keydown”:
如果(!keyIsDown[e.keyCode]){
keyIsDown[e.keyCode]=真;
//检查他们是否选择了ctrl-r,这将刷新屏幕
if(keyIsDown[17])
{
开关(如钥匙代码)
{
案例82://CTRL-R刷新屏幕!不想这样做!
e、 停止传播();
e、 预防默认值();
returnVal=false;//false表示不传播
打破
案例79://默认情况下,CTRL-O会打开一个“打开文件”对话框。
e、 停止传播();
e、 预防默认值();
returnVal=false;//false表示不传播
//调用openDocument
装载文件(假);
打破
案例68://默认情况下,CTRL-D会在Chrome中打开书签编辑器。我们想开始评论!
e、 停止传播();
e、 预防默认值();
returnVal=false;//false表示不传播
createComment();
打破
}
}
}
打破
案例“keyup”:
删除(keyIsDown[e.keyCode]);
//把钥匙放在这里
打破
}
返回值;
}
接受其他建议、改进、意见等
问候,
抢劫