2021-07-31

鼠标点击事件

今天要讲的是鼠标的点击事件：

首先我们先看布局，我一共是写了四个button按钮

这是页面的展示效果

click 单击事件：触发每一个匹配元素的click事件。这个函数会调用执行绑定到click事件的所有函数。

当我们单击这个按钮时，就弹出一个提示框输出：“click 单击事件：当鼠标单击时触发”。

dblclick 双击事件：当双击元素时，会发生dblclick 事件。当鼠标指针停留在元素上方，然后按下并松开鼠标左键时，就发生一次click事件。在很短的时间内发生两次click，即是一次double click事件。提示如果把double 和click事件应用于同一元素，可能会产生问题。

当鼠标双击这个按钮时，就弹出一个提示框输出：“dblclick 双击事件：当鼠标双击时触发”。

mousedown鼠标按下事件当鼠标指针移动到元素上方，并按下鼠标按键时，会发生 mousedown 事件。mousedown 与 click 事件不同，mousedown 事件仅需要按键被按下，而不需要松开即可发生。

当鼠标按下这个按钮时，就弹出一个提示框输出：“mousedown 鼠标按下事件：当鼠标点击时触发”。

mouseup鼠标弹起事件：当元素上放松鼠标按钮时，会发生mouseup事件。与click事件不同，mouseup事件仅需要放松按钮。当鼠标指针位于元素上方时，放松鼠标按钮就会触发该事件。

当鼠标弹起时，就弹出一个提示框输出：“mouseup鼠标弹起事件：当鼠标点击完成松开时触发”。