通过键盘的onkeydown 事件,获得事件对象(event)的keyCode 可以做一些限制输入的功能,做项目是有几个输入框需要输入的数字为整
数且数字必须小于某一个值,这种方法比较好,也省去了校验。这里我做了一个简单限制数字输入的功能。
    其中有个两个事件操作的函数分别为preventDefault()/*停止默认事件*/, 和stopPropagation()/*停止事件冒泡*/,这两个函数比较经典,
是参考jquery的源代码及网上的几篇文章(这几篇文章地址已经记不住了...)改的。在写这两个函数的时候有一个问题困扰了我很久:如何往这两
个函数里面传递事件对象呢?
 首先我先说s一下s事件对象的传递,我们在页面上建一个input id 为inp 代码很简单<input id="inp" value="" type="text" />
   我们有两种方法可以传递事件(以onkeydown 事件为例):              PS: 功能太小,就不动用jQuery了,顺便也学习一下事件
  1.<input id="inps" value="" type="text" onkeydown = "preventDefault(event);stopPropagation(event);" /> 我想这种方式大家
      都用吧,只是事件操作和DOM元素混杂在一起,当事件操作很多的时候很不方便,

  2.就是用DOM 了,也是我困惑的地方,我看到jquery里面都类似这样传递的$("#XDom").click(function(e){e.preventDefault()});怎么会凭空
     多了个 e 出来了,而且e 就变成事件对象了,好神奇呀,于是我就这样写document.getElementById("inp").οnkeydοwn=function(e){
     alert(e);} 然后分别在ie 和ff中运行,ie 弹出"undefined" 而ff弹出'[object KeyboardEvent]' ,这下明白了,其实这个e只是变量换成其他名字
     也可以,ff会捕获当前的事件,而ie 不会,ie 也好办呀,window.event就是ie的全局事件对象(不知道这样说对不对,差不多就这个意思了...)只
     要处理一下就好了 var e = e || window.event; 这样就使得e不论在ff还是在ie中都是事件对象了

下面是事件操作的代码:



Code 
  
function stopPropagation(event) {
     var e = event || window.event;
     if (e.stopPropagation)
         e.stopPropagation();
     e.cancelBubble = true;
 };

function preventDefault(event) {
     var e = event || window.event;
     if (e.preventDefault)
         e.preventDefault();
     e.returnValue = false;
 };



 

这个数字输入限制的功能也就简单啦, 只是keyCode 查起来真麻烦,完整代码如下:

 



Code 
  
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
   <head>
     <meta http-equiv="content-type" content="text/html; charset=gbk"/>
     <title>数字输入限制</title>
     <script type="text/javascript">

function stopPropagation(event) {
     var e = event || window.event;
     if (e.stopPropagation)
         e.stopPropagation();
     e.cancelBubble = true;
 }

function preventDefault(event) {
     var e = event || window.event;
     if (e.preventDefault)
         e.preventDefault();
     e.returnValue = false;
 }

function judgeevent(num,o,e) {
         e = e ? e : window.event;
         var code = e.keyCode
         if ((code < 96 || code > 105) && (code < 48 || code > 57)  && (code != 8) && (code != 39) && (code != 37) && (code != 46)) {

             preventDefault(e);
         } else {
             if(code >= 48 && code <= 57) {
                 var tempvalue = o.value;
                 var tempNum=parseInt(code)-48;
                 var orNum = tempvalue != ""?parseInt(tempvalue):0;
                 if((orNum * 10 + tempNum) > num) {

                     preventDefault(e);
                 }
             } else if(code >= 96 && code <= 105){
                 var tempvalue = o.value;
                 var tempNum=parseInt(code)-96;
                 var orNum = tempvalue != ""?parseInt(tempvalue):0;
                 if((orNum * 10 + tempNum) > num) {
         
                     preventDefault(e);
                 }
             }
         }
     }
     </script>
   </head>
   <body >

   输入100以下的整数:

<input type="text" id="inp" value=""  />
     
     <script type="text/javascript">
         document.getElementById("inp").onkeydown = function(e){
             //alert(e);
            judgeevent(99,this,e)
         }
     </script>
   </body>
</html>


 代码发了两遍才发上来,tinyMCE好像有问题呀!