[Js 事件绑定中的keyup keydown keypress]

结论：键盘任意按键松开时候触发onkeyup, 可输入字符按下时候先触发onkeydown,再触发onkeypress，非可输入字符按下仅触发onkeydown事件。

图论：

代码论述：

 1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
 2 
 3 <html xmlns="http://www.w3.org/1999/xhtml">
 4 <head>
 5     <title></title>
 6     <script type="text/javascript" src="jquery-1.8.3.js"></script>
 7     <script type="text/javascript">
 8         $(function () {
 9             var $input = $('#txtCounter');
10             var inputVal = '0';
11 
12             if ($input.val() != inputVal) {
13                 $input.val(inputVal);
14             }
15 
16             $input.bind({
17 //                'keyup': function () {
18 //                    inputVal++;
19 
20 //                    console.log('keyup, counter = ' + inputVal);
21 //                    $input.val(inputVal);
22 //                },
23                 'keydown': function () {
24                     inputVal++;
25 
26                     console.log('keydown, counter = ' + inputVal);
27                     $input.val(inputVal);
28                 },
29                 'keypress': function () {
30                     inputVal++;
31 
32                     console.log('keypress, counter = ' + inputVal);
33                     $input.val(inputVal);
34                 }
35             });
36         });
37     </script>
38 </head>
39 <body>
40     <div>
41         <input type="text" id="txtCounter" value="0"/>
42     </div>
43 </body>
44 </html>

 

 

<完>

posted @ 2014-09-01 10:07  Thirty  阅读(1281)  评论(0)  编辑  收藏  举报