JavaScript鼠标事件详解：mousedown、mouseup与click、dblclick的交互机制

mousedown与mouseup事件基础

mouseDown事件和mouseUp事件

通常认为，mouseDown事件与mouseUp事件的组合构成了click事件。然而，如果在链接上按下鼠标按钮后，将光标移动到该链接区域之外再释放鼠标，此时仅会触发mouseDown事件。

这两个事件常被用于实现图标按钮的图像反馈效果，例如按下时显示按下状态，松开时恢复原状。

关于mouseDown和mouseUp事件的属性，它们与Click事件的发生机制类似。这与KeyPress事件由KeyDown和KeyUp事件组合而成的原理是一致的。

这三个鼠标事件同样具备modifier属性，用于检测修饰键的状态。

需要注意的是，如果在onClick事件处理程序中使用return语句，它可以返回任意数值。只要该返回值不为False，浏览器就会继续执行表单提交操作。

反之，如果浏览器接收到False值，表单提交动作将被取消。

click与dblclick事件的冲突处理

Click事件和dbClick事件

onClick代表单击事件，onDblClick代表双击事件。在实际操作中，区分连续的单击和双击往往存在困难，两者容易相互干扰。此外，Internet Explorer（IE）与其他浏览器的行为表现可能存在差异。

部分浏览器中，双击操作的每一次单击都会触发单击事件；而在IE浏览器中，只有双击操作的第一次单击会触发单击事件。

无论哪种情况，单击事件都不会被自动取消或忽略。

因此，若希望在一个链接上分别触发单击和双击两种完全不同的处理逻辑，必须通过编程方式延迟单击动作的执行，直至确认是否为双击。

示例代码如下：

<script>

var timer=null;

document.onclick=new Function("timer=setTimeout(click,500)")

document.ondblclick=new Function("clearTimeout(timer);dblclick()")

function click(){

alert("click")

function dblclick(){

alert("dblclick")

</script>

在高版本浏览器中，链接的这两种事件处理程序都会监控那些导致脚本阻止链接特殊行为的情况。

例如：在导航到另一个页面之前进行某些数据项的确认。如果某些字段填写不正确，可以弹出提醒并终止链接跳转。要实现这种确认机制，必须在事件处理程序的最后一条语句中，或者由事件处理程序自身返回True或False。如果返回False，则终止链接跳转。

事件处理程序得最后一条语句或者事件处理程序自身返回True或False。如果返回False就终止链接。