我在一个应用程序中使用 Tinymce,该应用程序显示 html 文档并允许用户对其进行注释。
我创建了许多插件并附加了我自己的快捷方式。我还通过注释tinymce javascript 中的分配并创建自己的处理程序来创建自己的粗体、斜体和下划线处理程序。
但是有一些快捷方式我似乎无法使用。
我正在使用 addShortcut 调用。例如,无论我如何尝试覆盖它,CTRL-O 都会弹出一个标准文件打开窗口。我可以分配 CTRL-SHIFT-O,效果很好。
我还希望能够覆盖浏览器使用的快捷方式的默认行为,例如用于刷新的 CTRL-R。我们的主要用户非常喜欢使用键盘快捷键,担心他会不小心按下 CTRL-R,这可能会刷新页面并丢失未保存的工作。
有没有办法在 CTRL-R 到达浏览器之前覆盖或拦截它?
预先感谢您的帮助。
最佳答案
实际上,我从 StackOverflow 上的另一篇文章中找到了解决此问题的方法,它使我能够完全控制所有击键,并让我轻松捕获我想要的任何快捷键。这成功地覆盖了用于刷新的 CTRL-R 和用于打开的 CTRL-O。 我对示例代码做了一些修改,但非常感谢 hiss056 提供的解决方案。他的回答以及其他一些有用的示例可以在以下位置找到:
Overriding Browser's Keyboard Shortcuts
下面是我的代码版本:
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;
}
接受其他建议、改进、评论等。
问候,
抢
关于javascript - 覆盖 Tinymce 中的快捷方式分配,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/19791696/