js函数中onmousedown和onclick的区别和联系探讨
更新时间：2013年05月19日 15:20:32 作者：
了解这两个事件的区别，但是实际并没有使用到这两个事件的区别去做一些操作，通常使用onclick的时候也可以使用onmousedown，使用onclick的时候更多一些
这两个事件很常见。
了解这两个事件的区别，但是实际并没有使用到这两个事件的区别去做一些操作。
通常使用onclick的时候也可以使用onmousedown，使用onclick的时候更多一些。
今天碰到了非使用onmousedown不可的时候，故特此记录。
先说一下区别：onclick是在鼠标点击弹起之后触发的事件。onmousedown是在鼠标按下之后触发的事件。
简单的说onclick = onmousedown + onmouseup;
如果在某个地方按下鼠标后移开鼠标在另外一个地方松开鼠标会触发onmousedown事件，但是onclick事件却不会被触发。
我们今天要实现的功能是点击a标签，切换到另外一个页面，在原页面关闭之前需要触发一个函数。不是windowunload。
之前使用的是onclick事件，IE中测试无问题，但是在FF中测试发现，在页面被销毁之前还没有来得及执行这个函数。
如果使用onmousedown事件，虽然也没有办法保证该函数一定被执行，但是为该函数的执行争取了一定的时间，因为跳转是在鼠标弹起之后执行的。
解决办法一：onclick="return test()"，当且仅当当该函数返回true之后才执行跳转。这样导致了一个新的问题。如果我们在test函数中执行了多线程程序或者新开线程的程序后，会先返回true，跳转，新开的线程就没有被执行。如下面的函数：
function test()
{
(new Image()).src="1.html";
window.open("1.html","_new");
//alert("ok");
return true;
}
我在1.html文件中设置了<body onload="javascript:alert('ok')">，当1.html并没有被完全渲染结束时，跳转已经执行了。new image函数也没有保证已经被执行了。
在使用单一线程执行函数时，可使用return test（）这种方法。
解决办法二：估计一下test函数的多线程函数的最长执行速度，加入执行时间为100.不在a标签中使用跳转。在test函数中使用setTimeout（location.href="1.html",100）来执行跳转。
了解这两个事件的区别，但是实际并没有使用到这两个事件的区别去做一些操作。
通常使用onclick的时候也可以使用onmousedown，使用onclick的时候更多一些。
今天碰到了非使用onmousedown不可的时候，故特此记录。
先说一下区别：onclick是在鼠标点击弹起之后触发的事件。onmousedown是在鼠标按下之后触发的事件。
简单的说onclick = onmousedown + onmouseup;
如果在某个地方按下鼠标后移开鼠标在另外一个地方松开鼠标会触发onmousedown事件，但是onclick事件却不会被触发。
我们今天要实现的功能是点击a标签，切换到另外一个页面，在原页面关闭之前需要触发一个函数。不是windowunload。
之前使用的是onclick事件，IE中测试无问题，但是在FF中测试发现，在页面被销毁之前还没有来得及执行这个函数。
如果使用onmousedown事件，虽然也没有办法保证该函数一定被执行，但是为该函数的执行争取了一定的时间，因为跳转是在鼠标弹起之后执行的。
解决办法一：onclick="return test()"，当且仅当当该函数返回true之后才执行跳转。这样导致了一个新的问题。如果我们在test函数中执行了多线程程序或者新开线程的程序后，会先返回true，跳转，新开的线程就没有被执行。如下面的函数：
复制代码 代码如下:
function test()
{
(new Image()).src="1.html";
window.open("1.html","_new");
//alert("ok");
return true;
}
我在1.html文件中设置了<body onload="javascript:alert('ok')">，当1.html并没有被完全渲染结束时，跳转已经执行了。new image函数也没有保证已经被执行了。
在使用单一线程执行函数时，可使用return test（）这种方法。
解决办法二：估计一下test函数的多线程函数的最长执行速度，加入执行时间为100.不在a标签中使用跳转。在test函数中使用setTimeout（location.href="1.html",100）来执行跳转。
您可能感兴趣的文章:
- JS实现同一DOM元素上onClick事件与onDblClick事件并存的解决方法
- javascript中onclick(this)用法介绍
- js给onclick事件赋值，动态传参数实例解说
- JavaScript给按钮绑定点击事件（onclick）的方法
- javascript 动态改变onclick事件触发函数代码
- IE8的JavaScript点击事件(onclick)不兼容的解决方法
- js动态添加onclick事件可传参数与不传参数
- js修改onclick动作的四种方法(推荐)
- js onclick事件传参讲解
- 代码触发js事件(click、change)示例应用
- JavaScript中click和onclick本质区别与用法分析
相关文章
jquery 就对javascript的一个扩展，封装，就是让javascript更好用，更简单，为了说明区别，下面与大家分享下JavaScript 与JQuery 常用方法比较2013-07-07
本文总结了"异步模式"编程的4种方法，理解它们可以让你写出结构更合理、性能更出色、维护更方便的Javascript程序2014-02-02
这篇文章主要介绍了javascript 中的事件委托详解的相关资料,需要的朋友可以参考下2016-10-10
JSON.stringify()方法用于将一个值转为JSON字符串,该字符串符合JSON格式,并且可以被JSON.parse()方法还原,下面这篇文章主要给大家介绍了关于JS JSON.stringify()的5使用场景,需要的朋友可以参考下2023-01-01
由于变量b中保存的是函数的引用，当函数变化时，b也随时变化，且不管函数出现的先后顺序。两次alert（b），虽然位置不一样，但是内容相同。2010-11-11
这篇文章主要介绍了JavaScript中对DOM节点的访问、创建、修改、删除,是JavaScript入门学习中的基础知识,需要的朋友可以参考下2015-11-11
这篇文章主要介绍了JavaScript中循环遍历Array与Map的各种方法,利用的都是js入门学习中的基础知识,需要的朋友可以参考下2016-03-03
文是JavaScript库Mootools的入门性介绍文章，详细介绍了在网上能找到的比较好的学习HTML,CSS,JavaScript入门知识的资源以及随手参考的地方。文中介绍的从零入手学习JavaScript编程的过程很有参考价值。2008-04-04
这篇文章主要介绍了js oncontextmenu事件使用详解,需要的朋友可以参考下2017-03-03
opener: 指parent表示父窗口，比如一个A页面利用iframe或frame调用B页面，那么A页面所在窗口就是B页面的parent，下面为大家介绍下其详细的使用方法，感兴趣的朋友可以参考下2013-10-10
最新评论