码迷,mamicode.com
首页 > 其他好文 > 详细

限定文本框只能输入数字实例代码

时间:2016-01-05 15:34:01      阅读:123      评论:0      收藏:0      [点我收藏+]

标签:

限定文本框只能输入数字实例代码:
有时候文本框中可以输入的内容只能够限定为数字,比如邮编和电话号码等。实现此中效果的方法有多种,比较常用的比如有正则表达式方式,不过这里咱们不采用这个,下面介绍一下如何通过keyCode属性值实现此效果。
代码实例如下:

<!DOCTYPE html>
<html>
<head>
<meta charset=" utf-8">
<meta name="author" content="http://www.softwhy.com/" />
<title>规定文本框只能够输入数字-蚂蚁部落</title>
<script type="text/javascript"> 
function kp(ev){ 
  var ev=ev||window.event;
  if(ev.keyCode<=47||ev.keyCode>=65){ 
    ev.returnValue=false; 
  } 
} 
function kpd(){ 
  var ev=ev||window.event;
  if(ev.keyCode<=47||(ev.keyCode>=65&&ev.keyCode!=190)){ 
    ev.returnValue=false; 
  } 
} 
window.onload=function(){
  var ofirst=document.getElementById("first");
  var osecond=document.getElementById("second");
   
  ofirst.onkeydown=kp;
  osecond.onkeydown=kpd;
}
</script> 
</head> 
<body> 
只能输入0-9:<input type="text" id="first" /><br/> 
只能输入0-9.:<input type="text" id="second" /> 
</body> 
</html>

以上代码实现了我们的需要,在第一个文本框中只能够输入0-9数字,第二个文本框只能够输入0-9和点(.),下面介绍一下实现过程:
一.实现原理:
为两个文本框分别注册onkeydown事件处理函数,此函数中可以通过事件对象的keyCode属性判断到底是按下的哪个键,如果不在规定的范围内,那么就会无效,否则将会将按键对应的字符输入文本框。
二.相关阅读:
1.ev=ev||window.event可以参阅var ev=window.event||ev的作用是什么一章节。
2.keyCode属性可以参阅javascript的keyCode属性一章节。
3.onkeydown事件可以参阅javascript的onkeydown事件一章节。

原文地址是:http://www.softwhy.com/forum.php?mod=viewthread&tid=9100

更多内容可以参阅:http://www.softwhy.com/javascript/

限定文本框只能输入数字实例代码

标签:

原文地址:http://www.cnblogs.com/zhengzebiaodashi/p/5102205.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!