解决Typecho EditorMD插件在Chrome下无法点击编辑器工具栏按钮的问题

Author： Quan
发布时间：March 5, 2019
5400views
No comments
3582 words
Categories：教程

- ## **前言**

今天是博客全新上线的第二天，等我完善好博客想要写篇文章的时候，却发现博客的EditorMD编辑器的工具栏点了好无反应，然后我就怀疑是不是插件问题，结果整了半天也没弄好。
这个时候，万能的群友一语道破!
![](https://ws3.sinaimg.cn/large/007OJ0jqgy1g3g1ej3w34j304v06x0sq)
editor.md中函数editormd.mouseOrTouch有问题。
它原本的目的是判断设备是否有触摸屏，然后只给按钮添加“click”事件或则只添加“touchend”事件。但是没有考虑到有触摸屏的笔记本，此时只工具栏按钮只添加了“touchend”事件，即按钮不能用鼠标点击，触摸屏就可以点击。
原来是EditorMD的代码的问题啊，和我的设置没关系。但是，我得用啊，只能自己动手修复咯。

## **解决方式**

### 出错代码

/**
         * 鼠标和触摸事件的判断/选择方法
         * MouseEvent or TouchEvent type switch
         * 
         * @param   {String} [mouseEventType="click"]    供选择的鼠标事件
         * @param   {String} [touchEventType="touchend"] 供选择的触摸事件
         * @returns {String} EventType                   返回事件类型名称
         */
        
        editormd.mouseOrTouch = function(mouseEventType, touchEventType) {
            mouseEventType = mouseEventType || "click";
            touchEventType = touchEventType || "touchend";
            
            var eventType  = mouseEventType;
    
            try {
                document.createEvent("TouchEvent");
                eventType = touchEventType;
            } catch(e) {}
    
            return eventType;
        };

github地址：https://github.com/pandao/editor.md/blob/master/editormd.js#L4468

### 修改代码

editormd.mouseOrTouch = function(mouseEventType, touchEventType) {
            mouseEventType = mouseEventType || "click";
            touchEventType = touchEventType || "touchend";
    
            var eventType  = mouseEventType;
    
            try {
                document.createEvent("TouchEvent");
               // eventType = touchEventType;
            } catch(e) {
                console.log(e.toString());
            }
            //解决chrome浏览器不绑定工具栏点击事件
            var userAgentInfo = navigator.userAgent;
          //  console.log(userAgentInfo);
            var Agents = new Array("Android", "iPhone",  "Windows Phone", "iPad", "iPod");
            var flag = false;
            for (var v = 0; v < Agents.length; v++) {
                if (userAgentInfo.indexOf(Agents[v]) > 0) {
                    flag = true;
                    break;
                }
            }
            if(flag){
                eventType = touchEventType;
            }
           // console.log(eventType);
            return eventType;
        };
		
**注**：修改代码参考于[独倚烟花笑](https://blog.csdn.net/smallbabylong/article/details/83658176 "独倚烟花笑")

在此代码的基础上，我针对于editormd.min.js文件内的代码做了修改：

**原代码**：

`t.mouseOrTouch=function(e,t){e=e||"click",t=t||"touchend";var i=e;try{document.createEvent("TouchEvent"),i=t}catch(o){}return i}`

**修改后的代码**：

`t.mouseOrTouch=function(e,t){e=e||"click",t=t||"touchend";var i=e;try{document.createEvent("TouchEvent")}catch(o){} var userAgentInfo=navigator.userAgent;var Agents=new Array("Android", "iPhone",  "Windows Phone", "iPad", "iPod");var flag=false;for (var v = 0; v < Agents.length; v++) {if(userAgentInfo.indexOf(Agents[v])>0){flag=true;break;}}if(flag){i=t;}return i}`

至此这个问题就算是解决了。剩下的就是上传到服务器了。
打开xfpt，将附件中的editormd.min.js.txt文件改名为editormd.min.js上传到/usr/plugins/EditorMD/js目录下，直接覆盖原文件。
![](https://ws3.sinaimg.cn/large/007OJ0jqgy1g3g1f9emk2j30bz03yjrc)

到此就算是彻彻底底的解决了，现在刷新下就可以正常使用了。

## **附件**

[editormd.min.js.txt](https://myelf.club/usr/plugins/../../usr/uploads/2019/03/editormd.min.js.txt)

## **参考资料**

https://github.com/pandao/editor.md/blob/master/editormd.js
https://blog.csdn.net/smallbabylong/article/details/83658176
https://github.com/JaxsonWang/WP-Editor.md/issues/153

Last modification：May 27th, 2019 at 06:12 pm

If you think my article is useful to you, please feel free to appreciate

解决Typecho EditorMD插件在Chrome下无法点击编辑器工具栏按钮的问题

Quan • 2019 年 03 月 05 日

- ## **前言**

## **解决方式**

### 出错代码

github地址：https://github.com/pandao/editor.md/blob/master/editormd.js#L4468

### 修改代码

在此代码的基础上，我针对于editormd.min.js文件内的代码做了修改：

**原代码**：

`t.mouseOrTouch=function(e,t){e=e||"click",t=t||"touchend";var i=e;try{document.createEvent("TouchEvent"),i=t}catch(o){}return i}`

**修改后的代码**：

到此就算是彻彻底底的解决了，现在刷新下就可以正常使用了。

## **附件**

[editormd.min.js.txt](https://myelf.club/usr/plugins/../../usr/uploads/2019/03/editormd.min.js.txt)

## **参考资料**

https://github.com/pandao/editor.md/blob/master/editormd.js
https://blog.csdn.net/smallbabylong/article/details/83658176
https://github.com/JaxsonWang/WP-Editor.md/issues/153

解决Typecho EditorMD插件在Chrome下无法点击编辑器工具栏按钮的问题

Leave a Comment Cancel reply

自建 RSSHub 公开使用说明

ELF_RSS 订阅插件使用、安装教程

天翼云盘目录直链解析批量下载

酷Q 推特转发机器人插件

酷Q RSS订阅转发插件安装教程实现Twitter、YouTube等转发

Linux 挂载另一台服务器磁盘

解决Typecho EditorMD插件在Chrome下无法点击编辑器工具栏按钮的问题

此内容被密码保护

qbittorrent 实现自动下载番剧更新并在线播放

02MySQL基本操作

解决Typecho EditorMD插件在Chrome下无法点击编辑器工具栏按钮的问题