为输入框加入数字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 相关文章推荐
js读写(删除)Cookie实例详解
Apr 17 Javascript
jQuery下拉友情链接美化效果代码分享
Aug 26 Javascript
JS实现浏览器状态栏文字从右向左弹出效果代码
Oct 27 Javascript
HTML5 实现的一个俄罗斯方块实例代码
Sep 19 Javascript
Chrome不支持showModalDialog模态对话框和无法返回returnValue问题的解决方法
Oct 30 Javascript
javascript中apply/call和bind的使用
Feb 15 Javascript
浅谈vue实现数据监听的函数 Object.defineProperty
Jun 08 Javascript
JS实现点击下拉菜单把选择的内容同步到input输入框内的实例
Jan 23 Javascript
详解创建自定义的Angular Schematics
Jun 06 Javascript
使用js实现单链解决前端队列问题的方法
Feb 03 Javascript
解决echarts echarts数据动态更新和dataZoom被重置问题
Jul 20 Javascript
JavaScript代码实现微博批量取消关注功能
Feb 05 Javascript
详谈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
PHP 反射机制实现动态代理的代码
2008/10/22 PHP
php地址引用(php地址引用的效率问题)
2012/03/23 PHP
php+html5实现无刷新图片上传教程
2016/01/22 PHP
调用WordPress函数统计文章访问量及PHP原生计数器的实现
2016/03/21 PHP
PHP生成推广海报的方法分享
2018/04/22 PHP
ThinkPHP3.2框架操作Redis的方法分析
2019/05/05 PHP
PHP批斗大会之缺失的异常详解
2019/07/09 PHP
javascript 函数调用的对象和方法
2010/07/01 Javascript
基于jquery的表格排序
2010/09/11 Javascript
可兼容IE的获取及设置cookie的jquery.cookie函数方法
2013/09/02 Javascript
基于jquery插件制作左右按钮与标题文字图片切换效果
2013/11/07 Javascript
通过pjax实现无刷新翻页(兼容新版jquery)
2014/01/31 Javascript
EasyUI中实现form表单提交的示例分享
2015/03/01 Javascript
canvas 弹幕效果(实例分享)
2017/01/11 Javascript
详解微信小程序入门五: wxml文件引用、模版、生命周期
2017/01/20 Javascript
原生JS轮播图插件
2017/02/09 Javascript
Angular 输入框实现自定义验证功能
2017/02/19 Javascript
vue webuploader 文件上传组件开发
2017/09/23 Javascript
ES6中字符串string常用的新增方法小结
2017/11/07 Javascript
Vue2 轮播图slide组件实例代码
2018/05/31 Javascript
解决vue-quill-editor上传内容由于图片是base64的导致字符太长的问题
2018/08/20 Javascript
个人小程序接入支付解决方案
2019/05/23 Javascript
jquery实现自定义树形表格的方法【自定义树形结构table】
2019/07/12 jQuery
js实现图片实时时钟
2020/01/15 Javascript
Postman参数化实现过程及原理解析
2020/08/13 Javascript
js实现头像上传并且可预览提交
2020/12/25 Javascript
Vue 修改网站图标的方法
2020/12/31 Vue.js
Python使用multiprocessing创建进程的方法
2015/06/04 Python
30秒轻松实现TensorFlow物体检测
2018/03/14 Python
Python之文字转图片方法
2018/05/10 Python
python中的&amp;&amp;及||的实现示例
2019/08/07 Python
在python shell中运行python文件的实现
2019/12/21 Python
Python + selenium + crontab实现每日定时自动打卡功能
2020/03/31 Python
银行职员工作失误检讨书
2014/10/14 职场文书
2015年党员发展工作总结
2015/05/13 职场文书
JS一分钟在github+Jekyll的博客中添加访问量功能的实现
2021/04/03 Javascript