现在有一个需求如下图:

产品经理说Card Number只能让输入数字(中间的空格是格式自加的,也是用js实现的),有时候我脑海中出现了个声音,啥玩意,加个type=number不就行了,事实发现图样图森破了,先不说type=number后面会有个上下标(虽然用css可干掉),但是这个类型是支持科学输入法的,就是小数点和e这样的是可以输入的,于是乎只能用其他的方式了,后来想用检索到输入了非数字就干掉,但是这样还是能输入,想法被打回,于是乎最终采用了键盘输入控制的办法,其实很简单,代码如下:

            var isNumber=function(keyCode){
// 数字
if (keyCode >= 48 && keyCode <= 57) {
return true;
}
// 小数字键盘
if (keyCode >= 96 && keyCode <= 105) {
return true;
}
//tab Backspace, del, 左右方向键
if (keyCode == 9||keyCode == 8|| keyCode == 32 || keyCode == 46 || keyCode == 37 || keyCode == 39) {
return true;
}
return false
}

所谓键盘输入控制就是根据键盘输入的keycode来判断输入的是什么类型,即获取按下的键盘按键Unicode值,键盘上每个按键对应的keycode是固定的,网上有很多对照表,我这里就不贴上去了,每一次按键监测到对应的keycode然后对照是否合法,需要注意的是这里合法的不仅是数字,还有上下左右tab和空格方向键,不能禁用用户的操作指令,怎么样,看起来很简单吧。

最新文章

  1. selenium自动化-java-封装断言
  2. Linux中profile、bashrc、bash_profile之间的区别和联系
  3. HDOJ 4508 湫湫系列故事——减肥记I (完全背包带优化)
  4. Activity Lifecycle
  5. 使用supervisor的一些注意事项
  6. WPF使用RoutedCommand自定义命令
  7. pt-online-schema-change
  8. JBoss for luna
  9. JS事件流理解
  10. 3.Node.js 自定义微信菜单
  11. [0] Visual studio 2010 快捷键大全
  12. How to create DB2 user function easily by DB Query Analyzer 6.03
  13. 开源顶级持久层框架——mybatis(ibatis)——day02
  14. 随手记一 2018/04/23 session和cookie的区别
  15. Linux VPS基础命令 - cp复制文件命令
  16. Windows 批处理大全(附各种实例)
  17. vue中如何动态的绑定图片,vue中通过data返回图片路径
  18. 修饰词public、private、protected、默认、四者之间的区别
  19. vuejs安装篇
  20. vim定位到指定行数

热门文章

  1. 八卦一下黄晓明和Angelababy的电话号码
  2. Java 多线程(2)-Executor
  3. Linux--Ubuntu中文文件夹转英文
  4. hive中同列多行数据组合的方法以及array to string要点(行转列)
  5. WPF WebBrowser屏蔽弹出alert ,confirm ,prompt ,showModalDialog() ,window.open()
  6. ORACLE 日期函数[转载]
  7. 用 Jenkins 打包 iOS
  8. 没有 RunInstallerAttribute.Yes 的公共安装程序。在 C:/Program/xx.exe 程序集中可能可以找到
  9. win7 VS2012+openCV-2.4.11 配置
  10. 现代JavaScript开发者的工具箱