定義和用法
完整的 key press 過程分為兩個部分：1. 按鍵被按下；2. 按鍵被松開。
當(dāng)按鈕被按下時，發(fā)生 keydown 事件。
keydown() 方法觸發(fā) keydown 事件，或規(guī)定當(dāng)發(fā)生 keydown 事件時運(yùn)行的函數(shù)。
復(fù)制代碼 代碼如下:
<html>
<head>
<script type="text/javascript" src="/jquery/jquery.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("input").keydown(function(){
$("input").css("background-color","#FFFFCC");
});
$("input").keyup(function(){
$("input").css("background-color","#D6D6FF");
});
});
</script>
</head>
<body>
Enter your name: <input type="text" />
<p>當(dāng)發(fā)生 keydown 和 keyup 事件時，輸入域會改變顏色。請試著在其中輸入內(nèi)容。</p>
</body>
</html>
keyup是在用戶將按鍵抬起的時候才會觸發(fā)的，屬于整個按鍵過程中的最后階段，所以有其特定的用處，就是在左側(cè)輸入，右側(cè)同步顯示的過程中很有用處。典型的例子就是郵件編輯預(yù)覽的應(yīng)用。
復(fù)制代碼 代碼如下:
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>無標(biāo)題頁</title>
<script src="JS/jquery-1.4.2.js" type="text/javascript"></script>
<script type="text/javascript">
$(function() {
$('#t1').live('keyup', function() {
$('#v1').text($(this).val());
});
$('#t2').live('keydown', function() {
$('#v2').text($(this).val());
});
$('#t3').live('keypress', function() {
$('#v3').text($(this).val());
});
});
</script>
</head>
<body>
<textarea></textarea>
<div>
</div>
<textarea></textarea>
<div>
</div>
<textarea></textarea>
<div>
</div>
</body>
</html>
例如：keydown綁定文本框，每次點擊觸發(fā)事件，在獲取文本框的值，總是打印上次操作時文本框的內(nèi)容，
這是因為keydown操作后，事件觸發(fā)了，但值還未顯示在文本框中，所以這類操作要用keyup 一個完整的按鍵動作后，才可以獲取文本框的值。
keydown與keypress更適用于通過鍵盤控制頁面類功能的實現(xiàn)。
獲取鍵盤點擊的鍵位：
復(fù)制代碼 代碼如下:
<html>
<head>
<script type="text/javascript" src="/jquery/jquery.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("input").keydown(function(event){
$("div").html("Key: " + event.which);
});
});
</script>
</head>
<body>
請隨意鍵入一些字符：<input type="text" />
<p>當(dāng)您在上面的框中鍵入文本時，下面的 div 會顯示鍵位序號。</p>
<div />
</body>
</html>
新聞熱點
疑難解答
圖片精選
