【前端】JS-删除绑定事件

自己在练习输入密码框的时候突然想到之前用过的网站中基本都有这么一个功能：

最开始密码输入框里有提示输入密码的文字，点击之后文字消失，可以输入密码（此时密码是不可见的，也就是type是password）。这个需求很快就实现了，可是我写的代码还有一点问题，就是当输入框失去焦点，重新点击输入框的时候，原先输入的密码也消失了。

于是我开始分析问题，导致原先输入的密码消失的原因就是我的输入框绑定了一个点击事件，当我点击的时候，会把他的type设置为password，同时value设置为null。如果想解决问题，就需要让这个点击事件只在最开始的时候触发一次，也就是点击时候在做完我们想要的事情时候移除掉这个点击事件，现在提供移除点击事件的几种方法：

一、直接移除点击事件

Element.onclick = null;

二、通过removeEventListener方法

// 这里fn必须是原有绑定的函数，如果是匿名函数则不适用此方法
Element.removeEventListener(type, fn, false);

三、通过detachEvent方法

Element.detachEvent(type, fn); // 这里 fn 必须是原有绑定的函数，否侧解除无效

因为我写的demo里用的是匿名函数，所以采用了第一种方法。