js函數(shù)中onmousedown和onclick的區(qū)別和聯(lián)系探討

2019-11-20 22:42:36

字體：大中小

供稿：網(wǎng)友

這兩個(gè)事件很常見(jiàn)。
了解這兩個(gè)事件的區(qū)別，但是實(shí)際并沒(méi)有使用到這兩個(gè)事件的區(qū)別去做一些操作。
通常使用onclick的時(shí)候也可以使用onmousedown，使用onclick的時(shí)候更多一些。
今天碰到了非使用onmousedown不可的時(shí)候，故特此記錄。

先說(shuō)一下區(qū)別：onclick是在鼠標(biāo)點(diǎn)擊彈起之后觸發(fā)的事件。onmousedown是在鼠標(biāo)按下之后觸發(fā)的事件。
簡(jiǎn)單的說(shuō)onclick = onmousedown + onmouseup;
如果在某個(gè)地方按下鼠標(biāo)后移開(kāi)鼠標(biāo)在另外一個(gè)地方松開(kāi)鼠標(biāo)會(huì)觸發(fā)onmousedown事件，但是onclick事件卻不會(huì)被觸發(fā)。
我們今天要實(shí)現(xiàn)的功能是點(diǎn)擊a標(biāo)簽，切換到另外一個(gè)頁(yè)面，在原頁(yè)面關(guān)閉之前需要觸發(fā)一個(gè)函數(shù)。不是windowunload。
之前使用的是onclick事件，IE中測(cè)試無(wú)問(wèn)題，但是在FF中測(cè)試發(fā)現(xiàn)，在頁(yè)面被銷毀之前還沒(méi)有來(lái)得及執(zhí)行這個(gè)函數(shù)。
如果使用onmousedown事件，雖然也沒(méi)有辦法保證該函數(shù)一定被執(zhí)行，但是為該函數(shù)的執(zhí)行爭(zhēng)取了一定的時(shí)間，因?yàn)樘D(zhuǎn)是在鼠標(biāo)彈起之后執(zhí)行的。

解決辦法一：onclick="return test()"，當(dāng)且僅當(dāng)當(dāng)該函數(shù)返回true之后才執(zhí)行跳轉(zhuǎn)。這樣導(dǎo)致了一個(gè)新的問(wèn)題。如果我們?cè)趖est函數(shù)中執(zhí)行了多線程程序或者新開(kāi)線程的程序后，會(huì)先返回true，跳轉(zhuǎn)，新開(kāi)的線程就沒(méi)有被執(zhí)行。如下面的函數(shù)：

復(fù)制代碼代碼如下:

 
function test() 
{ 
(new Image()).src="1.html"; 
window.open("1.html","_new"); 
//alert("ok"); 
return true; 
} 

我在1.html文件中設(shè)置了<body onload="javascript:alert('ok')">，當(dāng)1.html并沒(méi)有被完全渲染結(jié)束時(shí)，跳轉(zhuǎn)已經(jīng)執(zhí)行了。new image函數(shù)也沒(méi)有保證已經(jīng)被執(zhí)行了。
在使用單一線程執(zhí)行函數(shù)時(shí)，可使用return test（）這種方法。

解決辦法二：估計(jì)一下test函數(shù)的多線程函數(shù)的最長(zhǎng)執(zhí)行速度，加入執(zhí)行時(shí)間為100.不在a標(biāo)簽中使用跳轉(zhuǎn)。在test函數(shù)中使用setTimeout（location.href="1.html",100）來(lái)執(zhí)行跳轉(zhuǎn)。

上一篇：JavaScript中幾個(gè)重要的屬性(this、constructor、prototype)介紹

下一篇：下拉菜單點(diǎn)擊實(shí)現(xiàn)連接跳轉(zhuǎn)功能的js代碼