addEventListener和attachEvent如何工作？ Keydown和Keyup不能正常工作

我爲mozilla的「shift key」keydown和keyup事件寫了一段代碼，但它並沒有像我期望的那樣工作。代碼：addEventListener和attachEvent如何工作？ Keydown和Keyup不能正常工作

<html> 
<head> 
<title>Testing Page</title> 
<script type="text/javascript"> 
var key_capslock = 0; 
var key_shift = 0; 

function print1(){ window.alert("shift status" + key_shift);} 
function print2(){ window.alert("shift status" + key_shift);} 
function keyset(evt){ 
    evt.preventDefault(); 
    if(evt.keyCode == 16){ 
    if(key_shift == 0){key_shift = 1; evt.stopPropagation();} 
    else {key_shift = 0; evt.stopPropagation();} 
    } 
print1(); 
return; 
} 
function keyrelease(evt){ 
    evt.preventDefault(); 
    if(evt.keyCode == 16){ 
     if(key_shift == 0){key_shift = 1; evt.stopPropagation();} 
     else {key_shift = 0; evt.stopPropagation();} 
    } 
print2(); 
return; 
} 

function init(){ 
document.body.setAttribute("contentEditable", true); 
document.body.addEventListener("keydown", keyset, false); 
document.body.addEventListener("keyup", keyrelease, false); 
} 
</script> 
</head> 
<body onload="init()"> 
<br> 
<body> 
</html>

步驟：1.按shift鍵（KEYDOWN和KeyUp事件發生）。 2.警報帶有換檔狀態（print1函數運行）。我點擊它。預期：警報應該與換檔狀態（print2功能應運行）。實際：print2函數不運行。

如果我第二次按shift鍵然後print2函數運行。我不明白mozilla如何處理addEventListener函數。有人可以幫我解決這個問題嗎？我不想使用任何第三方框架來解決這個問題（jQuery的，道場等）。

感謝

來源

2011-01-25 Gaurav

您的代碼實際上是很好，但警報消息把焦點從瀏覽器，防止其檢測keyup。

如果更改的功能寫入一個div，例如，你會看到，這兩種職能的工作：

http://jsfiddle.net/jtbowden/VqNvG/

雖然，我不明白這個代碼：

if(key_shift == 0){key_shift = 1; evt.stopPropagation();} 
else {key_shift = 0; evt.stopPropagation();}

如果您在keyset，key_shift應該始終爲1，而不是切換：

function keyset(evt){ 
    evt.preventDefault(); 
    if(evt.keyCode == 16){ 
    key_shift = 1; 
    evt.stopPropagation(); 
    } 
    print1(); 
    return; 
} 
function keyrelease(evt){ 
    evt.preventDefault(); 
    if(evt.keyCode == 16){ 
     key_shift = 0; 
     evt.stopPropagation(); 
    } 
    print2(); 
    return; 
}

來源

2011-01-25 18:19:40

addEventListener和attachEvent如何工作？ Keydown和Keyup不能正常工作

回答

相關問題