原生js实现拖动滑块验证题
前言
验证的目的是为了减轻超高数据量的访问时，服务器的压力，减少同时请求量；前端基本都不能避免与验证打交道，这里记录一下我对于滑块验证的学习过程。
思路
作为前端，我们要将自己带入用户的角度，对用户的操作习惯进行考虑，我将拖动滑块验证功能归纳为：三个事件、验证成功、验证失败。
按住滑块才能开始拖动(按下、移动、松开事件)
验证成功后不能再拖动(跳转页面或禁用)
验证失败时，滑块回归原始位置(拖动到一半松开)
代码结构
HTML结构：box -> 滑块+文字+背景
滑块移动思路
box position：relative
滑块 position：absolute
拖动滑块，让滑块的绝对定位left随鼠标坐标而改变，造成移动效果
通过evevt事件可以获取到当前X轴和Y轴坐标，event.clientX;clientY
event.clientX;clientY 是从屏幕左上角开始的坐标
滑块移动距离(left) = 用移动时鼠标的坐标 - 最开始鼠标按下的坐标
clipboard.png
控制滑块移动的范围，不超出box
(moveX >= 0 && moveX <= (boxWidth - btnWidth)
btn.style.lef
