javascript数字验证的实例代码(推荐)_javascript技巧

现在有一个需求如下图:

产品经理说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和空格方向键,不能禁用用户的操作指令,怎么样,看起来很简单吧。

以上这篇javascript数字验证的实例代码(推荐)就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持。

以上是小编为您精心准备的的内容,在的博客、问答、公众号、人物、课程等栏目也有的相关内容,欢迎继续使用右上角搜索按钮进行搜索javascript
验证
javascript经典实例、javascript项目实例、javascript实例、javascript实例精通、javascript实例教程,以便于您获取更多的相关知识。

时间: 2024-09-22 12:58:59

javascript数字验证的实例代码(推荐)_javascript技巧的相关文章

javascript修改表格背景色实例代码分享_javascript技巧

复制代码 代码如下: <html> <script> //点击当前选中行的时候设置当前行的颜色,同时恢复除当前行外的行的颜色及鼠标事件 function selectRow(target) {      var sTable = document.getElementById("ServiceListTable")      for(var i=1;i<sTable.rows.length;i++) //遍历除第一行外的所有行      {        

JS 实现倒计时数字时钟效果【附实例代码】_javascript技巧

这篇文章主要介绍了JS实现的网页倒计时数字时钟效果,是一款非常实用的javascript倒计时特效,具有一定参考借鉴价值,需要的朋友可以参考下 本文实例讲述了JS实现的网页倒计时数字时钟效果.分享给大家供大家参考.具体实现方法如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd&

JavaScript对IE操作的经典代码(推荐)_javascript技巧

这段时间一直在用ajax技术做东东,所以也就有更多机会对JavaScript知识进行学习.之前在网上搜集了一些关于JavaScript对IE操作的代码(具体在哪里cope的记不清了,所以出处就不加了),感觉在开发过程中很有用,当然只适用于IE,FF会有问题的.现在贴出来分享. 复制代码 代码如下: 1.将彻底屏蔽鼠标右键oncontextmenu="window.event.returnvalue=false"可用于Table<table oncontextmenu=return

javascript实现下雪效果【实例代码】_javascript技巧

原理 : 1.js动态创建DIV,指定CLASS类设置不同的背景图样式显示不同的雪花效果. 2.js获取创建的DIV并改变其top属性值,当下落的高度大于屏幕高后删除该移动div 3.好像不够完善勿喷 HTML代码: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>雪花飞舞</title> <lin

window.open不被拦截的简单实现代码(推荐)_javascript技巧

实例如下: $("#last").click(function(){ var w=window.open(); setTimeout(function(){ w.location="http://www.jb51.net"; }, 1000); return false; }); window.open是javascript函数,该函数的作用是打开一个新窗口或这改变原来的窗口,如果你直接在js中调用window.open()函数去打开一个新窗口,浏览器会拦截你,那么

Bootstrapvalidator校验、校验清除重置的实现代码(推荐)_javascript技巧

1.引入css与js bootstrapValidator.min.css bootstrapValidator.min.js 2.html中的modal代码 <div class="modal fade" id="editModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true&q

省市联动效果的简单实现代码(推荐)_javascript技巧

下拉框二级联动效果在日常应用场景中经常会碰到,尤其是涉及地区.品种等有多级选项时.例如:常见的省市联动下拉框,在选择省份时,城市列表也会更随改变. 思路: 1,所谓联动效果,是指出发父级的数据变化时,会影响到关联性子级数据元素的变化. 下面是造的省市的数据: var linkDatas = { provinces:[ { "code":"0", "name":"请选择" }, { "code":"

mvvm双向绑定机制的原理和实现代码(推荐)_javascript技巧

mvvm框架的双向绑定,即当对象改变时,自动改变相关的dom元素的值,反之,当dom元素改变时,能自动更新对象的值,当然dom元素一般是指可输出的input元素. 1. 首先实现单向绑定,在指定对象的属性值发生改变时触发callback函数. 2. 单向绑定可采用ES5新增的defineProperty实现(或defineProperties),用了ES5注定就不支持IE9以下了,为了防止递归死循环问题,原有属性需要剪切到一个私有属性中保存. 3. 循环调用defineProperty定义闭包时

JavaScript语言精粹经典实例(整理篇)_javascript技巧

数据类型 JavaScript 是 弱类型 语言,但并不是没有类型,JavaScript可以识别下面 7 种不同类型的值: 基本数据类型 1.Boolean 2.Number 3.String 4.null 5.undefined 6.Symbol Object 1.Array 2.RegExp 3.Date 4.Math 5.... 可以使用 typeof 判断数据类型,操作符返回一个字符串,但并非返回的所有结果都符合预期 typeof false // "boolean" type