免责声明:网站内容仅供个人学习记录,禁做商业用途,转载请注明出处。

版权所有 © 2017-2020 NEUSNCP个人学习笔记 辽ICP备17017855号-2

JS覆盖浏览器默认事件Ctrl + S

hxy    2019年11月14日 09:40:20

在实现博客保存草稿的功能时,经常按照习惯Ctrl + S了,于是浏览器弹出保存页面,但实际上我们更像通过按 Ctrl + S保存草稿。于是乎有了如下代码:
<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title>禁用浏览器CTRL+S默认事件</title>
    </head>
    <body>
        <script>
            // 监听键盘按下事件
            document.onkeydown = function() {
                // 判断 Ctrl+S
                if(event.ctrlKey == true && event.keyCode == 83) {
                    console.log('Ctrl + s');
                    // 或者 return false;
                    event.preventDefault();
                }
            }
        </script>
    </body>

</html>
但是呢,在CkEditor编辑器下,时灵时不灵的,原来Ckeditor有一套自己的事件,所以要想实现只要打开当前页面ctrl + S就保存,还需要添加Ckeditor的事件监听。
// 处理Ctrl + S自动保存
var editor = CKEDITOR.instances.blog_content;
// 设置值,并添加绑定事件
editor.setData(null,function(){
        //绑定keydown事件,既绑定键盘按下事件,其他事件见jquery的相关事件名称
        CKEDITOR.instances.blog_content.document.on("keydown", function(event){
        //绑定按下的建值值 为ctrl+s(处理保存的快捷键)
        if (event.data.$.keyCode == 83 && event.data.$.ctrlKey) {//注意取值的方法,和一般的event参数不一样
                event.data.$.preventDefault();//关闭默认的弹窗
                commit_save();
            //  save(true);//处理保存业务
            }
        });
});



 
最近更新: 2019年11月16日 15:52:14
浏览: 2.4K

[[total]] 条评论

添加评论
  1. [[item.time]]
    [[item.user.username]] [[item.floor]]楼
  2. 点击加载更多……
  3. 添加评论