returnfalse,對阻止事件默認動作的一些測試代碼_javascript技巧
來源:懂視網
責編:小采
時間:2020-11-27 20:55:50
returnfalse,對阻止事件默認動作的一些測試代碼_javascript技巧
returnfalse,對阻止事件默認動作的一些測試代碼_javascript技巧:首先頁面上有一個 我們為其綁定以下事件 代碼如下: test.onkeydown = function(){ return false; } test.onkeyup = function(){ return false; } test.onkeypress = function(){ return false; } 我們分別注釋
導讀returnfalse,對阻止事件默認動作的一些測試代碼_javascript技巧:首先頁面上有一個 我們為其綁定以下事件 代碼如下: test.onkeydown = function(){ return false; } test.onkeyup = function(){ return false; } test.onkeypress = function(){ return false; } 我們分別注釋

首先頁面上有一個
我們為其綁定以下事件
代碼如下:
test.onkeydown = function(){
return false;
}
test.onkeyup = function(){
return false;
}
test.onkeypress = function(){
return false;
}
我們分別注釋掉其中的兩個事件,每次測試僅綁定一個事件。
很明顯我們每個函數都返回false,如果返回值可以阻止事件默認動作,那么文本框將無法輸入任何內容。
看下面我測試的結果,注意紅的部分。
最后我分別把事件綁定兩次,每次返回false看是否能阻止默認動作。
還是用了一個a標記測試onclick 返回false 是否跳轉。
偵聽事件返回 false 是否阻止事件默認動作 |
|
chrome |
IE-8 |
firfox |
oper |
Safari |
onkeydown |
yes |
yes |
yes |
no |
yes |
onkeyup |
no |
no |
no |
no |
no |
onkeypress |
yes |
yes |
yes |
yes |
yes |
onclick |
yes |
yes |
yes |
yes |
yes |
keydown * 2 |
no |
取最后的FN結果 |
no |
no |
no |
keypress * 2 |
no |
取最后的FN結果 |
no |
no |
no |
click * 2 |
no |
取最后的FN結果 |
no |
no |
no |
e.preventDefault(); |
yes |
no |
yes |
yes(keydown:no) |
yes |
e.returnValue = false |
no |
yes |
no |
no |
no |
可以看出瀏覽器表現確實不太一樣,當然IE是最麻煩的東西了。
最意外的是在oper中 綁定down 返回false,居然也不能阻止默認動作。
所以以后在寫要阻止瀏覽器默認動作的時候,還用標準的方法比較好。(后面我提供了)
不然在多人協作的工作中,會相當麻煩。
演示的deom 有需要的可以發郵件給我。我就不貼上來了。
代碼如下:
/* * 用下面的代碼就不會發生悲劇了
* 最終結論
* E(e).stop(); 阻止時間冒泡
* E(e).prevent();阻止時間默認行為
*/
var E = function(e){
e = window.event || e;
return {
stop: function() {
if (e && e.stopPropagation) e.stopPropagation();
else e.cancelBubble = true
},
prevent: function() {
if (e && e.preventDefault) e.preventDefault();
else e.returnValue = false
}
}
}
聲明:本網頁內容旨在傳播知識,若有侵權等問題請及時與本網聯系,我們將在第一時間刪除處理。TEL:177 7030 7066 E-MAIL:11247931@qq.com
returnfalse,對阻止事件默認動作的一些測試代碼_javascript技巧
returnfalse,對阻止事件默認動作的一些測試代碼_javascript技巧:首先頁面上有一個 我們為其綁定以下事件 代碼如下: test.onkeydown = function(){ return false; } test.onkeyup = function(){ return false; } test.onkeypress = function(){ return false; } 我們分別注釋