引言

我在编写博客的时候，经常有一个编程的习惯。

Ctrl + S组合键保存

经历过一回电脑硬盘爆掉之后，看谁都是刁民，哪台电脑都不放心，写一点，写一点就要保存。

但偏偏Typecho这款博客网站软件，并没有天然支持这种方式保存的，另外去插件那边找吧，也嫌麻烦。

刚巧自己确实会一点点前端知识，干脆自己写一下算了。

实现

1. 找到“保存草稿”按钮

首先根据文章编辑页面的链接地址，找到目录的文件。

很明显，这里是博客的根目录下的/admin文件夹，找到这个write-post.php文件。

确定有这个文件之后，执行命令查看这个文件信息：

vim ./admin/write-post.php

在其中进行查找。

最终在64-65行找到保存草稿的按钮

抓重点，type="submit"代表按钮点击后就会整个表单提交

2. 查找对应的保存功能相关的Js代码

要想增加功能，肯定要先找到保存这个按钮的实际功能

我们可以用id="btn-save"这个特点来查找js相关代码

但这个单词(btn-save)只在这个文件出现了一次（仅有定义），初步怀疑是放到了外部js文件里。

如果不是，那就是整个表单一块提交上去了。

文章编辑页面最下面有一行include 'write-js.php';

代表外部引用了一个文件，看起来有点像是js代码的存放位置。

打开这个文件，我们可以在158 行看到有这个#btn-save选择器的字样

这里做了两次移除属性的操作，然后拿到JQuery构造的DOM对象信息作为变量。

那我们再去搜索btnSave变量，可以看到下面333行有用这个按钮注册点击事件的

3. 增加按键监听代码

我们在下面增加几行代码：

// Ctrl+S时调起保存
document.onkeydown = function () {
    // 过滤非组合键监听
    if (window.event.ctrlKey && window.event.keyCode == 83) {
        event.keyCode = 0;
        event.returnValue = false;

        // 模拟点击
        btnSave.click();
    }
}

这里是在整个document里注册一个监听onkeydown事件

而且做了判断，只要监测到按下Ctrl键，并且键码检测到83，也就是S键，就执行模拟点击这个保存按钮。

同时需要把当前的键码清除掉，避免后续键盘事件产生影响。

然后保存，wq!退出

测试

刷新文章编辑页面测试，发现已经确实可以使用快捷键Ctrl + S保存了。

搞定收工~

瑞思拜~