为输入框加入数字js校验代码分享


Posted in Javascript onNovember 02, 2017

js限制只能数字输入,并且在把输入的“非法字符”清除掉之后将焦点停留在输入非法字符的位置,参考如下:

html部分:

<input value="" type="text" onkeyup="javascript:RepNumber(this)">

JavaScript部分:

function RepNumber(obj) {
  var reg = /^[\d]+$/g;
  if (!reg.test(obj.value)) {
    var txt = obj.value;
    txt.replace(/[^0-9]+/,
    function(char, index, val) { //匹配第一次非数字字符
      obj.value = val.replace(/\D/g, ""); //将非数字字符替换成""
      var rtextRange = null;
      if (obj.setSelectionRange) {
        obj.setSelectionRange(index, index);
      } else { //支持ie
        rtextRange = obj.createTextRange();
        rtextRange.moveStart('character', index);
        rtextRange.collapse(true);
        rtextRange.select();
      }
    })
  }
}

下面再分享一个实例:

function chkNumber(eleText)
    {
       var value =eleText.value;
       var len =value.length;
       for(vari=0;i<len;i++)
       {
           if(value.charAt(i)>"9"|| value.charAt(i)<"0")
           {
              alert("含有非数字字符");
              eleText.focus();
              break;
           }
       }
    }

总结

以上就是本文关于为输入框加入数字js校验代码分享的全部内容,希望对大家有所帮助。欢迎参阅本站:Java实现JS中的escape和UNescape代码分享、在 Node.js 中使用原生 ES 模块方法解析等,如有不足之处,欢迎留言指出!

Javascript 相关文章推荐
由prototype_1.3.1进入javascript殿堂-类的初探
Nov 06 Javascript
json对象转字符串如何实现
Dec 02 Javascript
javascript和HTML5利用canvas构建猜牌游戏实现算法
Jul 17 Javascript
JavaScript控制listbox列表框的项目上下移动的方法
Mar 18 Javascript
JavaScript程序中实现继承特性的方式总结
Jun 24 Javascript
JavaScript浏览器对象模型BOM(BrowserObjectModel)实例详解
Nov 29 Javascript
vue.js移动数组位置,同时更新视图的方法
Mar 08 Javascript
小程序实现带年月选取效果的日历
Jun 27 Javascript
Flutter部件内部状态管理小结之实现Vue的v-model功能
Jun 11 Javascript
layui--select使用以及下拉框实现键盘选择的例子
Sep 24 Javascript
js实现表格单列按字母排序
Aug 12 Javascript
Vue中foreach数组与js中遍历数组的写法说明
Jun 05 Vue.js
详谈js中标准for循环与foreach(for in)的区别
Nov 02 #Javascript
使用 Node.js 模拟滑动拼图验证码操作的示例代码
Nov 02 #Javascript
基于JavaScript+HTML5 实现打地鼠小游戏逻辑流程图文详解(附完整代码)
Nov 02 #Javascript
vue-resource + json-server模拟数据的方法
Nov 02 #Javascript
详解vue-cli项目中用json-sever搭建mock服务器
Nov 02 #Javascript
Vue-cli 使用json server在本地模拟请求数据的示例代码
Nov 02 #Javascript
vue项目中使用axios上传图片等文件操作
Nov 02 #Javascript
You might like
实现分十页分向前十页向后十页的处理
2006/10/09 PHP
PHP 实现 JSON 数据的编码和解码操作详解
2020/04/22 PHP
Nigma vs AM BO3 第二场2.13
2021/03/10 DOTA
jQuery基础知识filter()和find()实例说明
2010/07/06 Javascript
extjs ColumnChart设置不同的颜色实现代码
2013/05/17 Javascript
javascript基本类型详解
2014/11/28 Javascript
JS定义网页表单提交(submit)的方法
2015/03/20 Javascript
Vue.js -- 过滤器使用总结
2017/02/18 Javascript
Angularjs的启动过程分析
2017/07/18 Javascript
ES6 javascript的异步操作实例详解
2017/10/30 Javascript
JS实现键值对遍历json数组功能示例
2018/05/30 Javascript
Node.js实现批量下载图片简单操作示例
2020/01/18 Javascript
Vue单页面应用中实现Markdown渲染
2021/02/14 Vue.js
Python使用scrapy采集时伪装成HTTP/1.1的方法
2015/04/08 Python
对python sklearn one-hot编码详解
2018/07/10 Python
Python random模块制作简易的四位数验证码
2020/02/01 Python
Python try except异常捕获机制原理解析
2020/04/18 Python
python 如何调用远程接口
2020/09/11 Python
python实现无边框进度条的实例代码
2020/12/30 Python
关于Python错误重试方法总结
2021/01/03 Python
任意存:BOXFUL
2018/05/21 全球购物
苏格兰在线威士忌商店:The Whisky Barrel
2019/05/07 全球购物
Saks Fifth Avenue澳洲/亚太地区:萨克斯第五大道精品百货店
2019/06/09 全球购物
银行员工职业规划范文
2014/01/21 职场文书
淘宝店铺营销方案
2014/02/13 职场文书
《奇妙的国际互联网》 教学反思
2014/02/25 职场文书
购房委托书
2014/10/15 职场文书
竞聘报告优秀范文
2014/11/06 职场文书
2014年家长学校工作总结
2014/11/20 职场文书
承兑汇票转让证明怎么写?
2014/11/30 职场文书
2014社会治安综合治理工作总结
2014/12/04 职场文书
2015年乡镇纪委工作总结
2015/05/26 职场文书
恰同学少年观后感
2015/06/08 职场文书
2019毕业典礼主持词!
2019/07/05 职场文书
vue使用v-model进行跨组件绑定的基本实现方法
2021/04/28 Vue.js
详解Golang如何优雅的终止一个服务
2022/03/21 Golang