Javascript中利用window.event.keyCode 实现金融文本框禁用非法输特效!

简介: 主要就是为了监听键盘按下的是哪个键,并且转成ASCII码;   DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.

主要就是为了监听键盘按下的是哪个键,并且转成ASCII码;

 

<! 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=gb2312"   />
    
< title > window.event.keyCode </ title >
</ head >
< body  onkeydown =" alert(window.event.keyCode)" >
    
< input  id ="txtCode"  type ="text"   />
</ body >
</ html >

 

那么如何用回车代替小键盘的回车呢?首先我们要知道,回车的ASCII码是13 ,TAB键的ASCII码是9那就好办啦;

 

<! 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=gb2312"   />
    
< title > 使用回车代替TAB键 </ title >
</ head >
< body  onkeydown ="if(window.event.keyCode==13){ window.event.keyCode=9}" >
    
< input  id ="txtCode"  type ="text"   />
    
< input  id ="txtCode2"  type ="text"   />
</ body >
</ html >

 

在上面的代码中我们使用了keyCode来实现回车代替TAB键,只是简单的做了一个判断,如果当按下的是回车(13),我们就把TAB(9)的值赋给它(骗骗计算机),这些小小的细节积累起来,也是一批不小的财富吧!

 

 下面接着写点东西,算是一个完整的示例吧;一个金融软件中文本框只能输入数字,和方向键,删除键等(代码中不是很严谨,仅供参考)

 

<! DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd" >
< html  xmlns ="http://www.w3.org/1999/xhtml" >
< head >
    
< title > 金融软件文本框禁用非法字符特效-2011-04-26 </ title >
    
< style  type ="text/css" >
        .ime
        
{
            ime-mode
:  disabled ;   /* *只对IE有效,禁用输入法切换* */
            width
: 300px ;
        
}
    
</ style >
    
< script  language ="javascript"  type ="text/javascript" >

        
function  isValiNum(k) {
            
return  (k  ==   9   ||  k  ==   13   ||  k  ==   46   ||  k  ==   8   ||  k  ==   189   ||  k  ==   190   ||  k  ==   110   ||  (k  >=   48   &&  k  <=   57 ||  (k  >=   96   &&  k  <=   105 ||  (k  >=   37   &&  k  <=   40 ));
        }

        
function  numKeyDown() {
            
var  k  =  window.event.keyCode;
            
// 判断输入字符是否合法;调用isValiNum函数;
             return  isValiNum(k);
        }

        
function  numPaste() {
            
// 从剪切板中获取数据;
             var  text  =  window.clipboardData.getData( " Text " );
            
for  ( var  i  =   0 ; i  <  text.length; i ++ ) {
                
var  asc  =  text.charCodeAt(i);    // 转成ASCII值;
                 if  ( ! isValiNum(asc)) {
                    
return   false ;
                }
            }
        }

        
// 自动给输入的数据加逗号;
         function  commafy(n) {
            
var  re  =   / \d{1,3}(?=(\d{3})+$) / g;
            
var  n1  =  n.replace( / ^(\d+)((\.\d+)?)$ / function  (s, s1, s2) {  return  s1.replace(re,  " $&, " +  s2; });
            
return  n1;
        }
    
</ script >
</ head >
< body >
    
< input  id ="txtCode"  type ="text"  class ="ime"  onpaste ="return numPaste()"  onkeydown ="return numKeyDown()"  onfocus ="this.style.textAlign='left'; this.value=this.value.replace(/,/g,'');"  onblur ="this.style.textAlign='right';this.value=commafy(this.value)"   />
</ body >
</ html >

 

 

目录
相关文章
|
4月前
|
JavaScript 前端开发 索引
用JavaScript精巧地实现文本框的粘贴功能:一次成功的尝试
前言:本文实际是用js移动控制光标的位置!解决了网上没有可靠教程的现状 废话连篇 默认情况对一个文本框粘贴,应该会有这样的功能: 粘贴文本后,光标不会回到所有文本的最后位置,而是在粘贴的文本之后 将选中的文字替换成粘贴的文本
43 1
|
JavaScript 前端开发
利用JavaScript实现二级联动
利用JavaScript实现二级联动 要实现JavaScript二级联动效果,首先要确定需要哪些技术: 二维数组 for in循环 new Option(text,value,true,true) add(option,null) onchange() 表单事件 HTML代码: &lt;!-- &lt;input type=&quot;text&quot; id=&quot;text&quot;&gt; --&gt; 请选择省份: &lt;select name=&quot;&quot; id=&quot;provinces&quot;&gt; &lt;!-- &lt;option value=&quot;江苏省&quot;&gt;江苏省&lt;/option&gt;
|
JavaScript 前端开发
JavaScript函数柯里化的实现原理,进来教你完成一个自己的自动实现柯里化方法
JavaScript函数柯里化的实现原理,进来教你完成一个自己的自动实现柯里化方法
167 0
|
移动开发 JavaScript weex
weex-自定义module,实现weex在iOS的本地化,js之间互相跳转,交互,传值(iOS接入weex的最佳方式)
weex-自定义module,实现weex在iOS的本地化,js之间互相跳转,交互,传值(iOS接入weex的最佳方式)
219 0
|
JavaScript
JS中实现或退出全屏
JS中实现或退出全屏
153 0
|
前端开发 JavaScript
前端:JS实现双击table单元格变为可编辑状态
前端:JS实现双击table单元格变为可编辑状态
365 0
|
JavaScript 算法 前端开发
【前端算法】JS实现数字千分位格式化
JS实现数字千分位格式化的几种思路,以及它们之间的性能比较
272 1
|
算法 前端开发 JavaScript
【前端算法】用JS实现快速排序
理解数组方法里面运用到的算法,splice 和 slice的区别
113 0
|
JavaScript 前端开发 算法
【前端算法】javaScript实现二分查找
如何使用JS实现一个合格的二分查找
191 0