为输入框加入数字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 相关文章推荐
jquery lazyload延迟加载技术的实现原理分析
Jan 24 Javascript
基于jquery的图片轮播 tab切换组件
Jul 19 Javascript
JavaScript的原型继承详解
Feb 15 Javascript
JavaScript中Date对象的常用方法示例
Oct 24 Javascript
jQuery插件zTree实现获取一级节点数据的方法
Mar 08 Javascript
详解Node.js项目APM监控之New Relic
May 12 Javascript
JS实现搜索关键词的智能提示功能
Jul 07 Javascript
JavaScript读写二进制数据的方法详解
Sep 09 Javascript
使用layui+ajax实现简单的菜单权限管理及排序的方法
Sep 10 Javascript
webpack打包html里面img后src为“[object Module]”问题
Dec 22 Javascript
keep-alive不能缓存多层级路由菜单问题解决
Mar 10 Javascript
vue路由分文件拆分管理详解
Aug 13 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 事务处理数据实现代码
2010/05/13 PHP
PHP网页游戏学习之Xnova(ogame)源码解读(四)
2014/06/23 PHP
解决Laravel 使用insert插入数据,字段created_at为0000的问题
2019/10/11 PHP
php使用fputcsv实现大数据的导出操作详解
2020/02/27 PHP
JavaScript中的闭包原理分析
2010/03/08 Javascript
实现变速回到顶部的JavaScript代码
2011/05/09 Javascript
纯js实现遮罩层效果原理分析
2014/05/27 Javascript
将数字转换成大写的人民币表达式的js函数
2014/09/21 Javascript
asp知识整理笔记3(问答模式)
2015/09/27 Javascript
微信小程序开发之视频播放器 Video 弹幕 弹幕颜色自定义实例
2016/12/08 Javascript
webpack实现热加载自动刷新的方法
2017/07/30 Javascript
js中的闭包学习心得
2018/02/06 Javascript
详解vue指令与$nextTick 操作DOM的不同之处
2018/08/02 Javascript
babel7.x和webpack4.x配置vue项目的方法步骤
2019/05/12 Javascript
Vue实现固定定位图标滑动隐藏效果
2019/05/30 Javascript
微信小程序绘制图片发送朋友圈
2019/07/25 Javascript
Vue中img的src是动态渲染时不显示的解决
2019/11/14 Javascript
小程序分享链接onShareAppMessage的具体用法
2020/05/22 Javascript
vue配置多代理服务接口地址操作
2020/09/08 Javascript
[00:33]2016完美“圣”典风云人物:BurNIng宣传片
2016/12/10 DOTA
Python中time模块和datetime模块的用法示例
2016/02/28 Python
python实现斐波那契数列的方法示例
2017/01/12 Python
Python操作使用MySQL数据库的实例代码
2017/05/25 Python
浅谈Scrapy框架普通反爬虫机制的应对策略
2017/12/28 Python
Python列表推导式、字典推导式与集合推导式用法实例分析
2018/02/07 Python
基于Python开发chrome插件的方法分析
2018/07/07 Python
Tensorflow 实现修改张量特定元素的值方法
2018/07/30 Python
Python Process多进程实现过程
2019/10/22 Python
使用CSS3配合IE滤镜实现渐变和投影的效果
2015/09/06 HTML / CSS
使用HTML5 Geolocation实现一个距离追踪器
2018/04/09 HTML / CSS
3种方式实现瀑布流布局小结
2019/09/05 HTML / CSS
印度在线内衣和时尚目的地:Zivame
2017/09/28 全球购物
个人简历中的自我评价范例
2013/10/29 职场文书
犯错检讨书
2014/02/21 职场文书
党员批评与自我批评思想汇报(集锦)
2014/09/14 职场文书
村干部任职承诺书
2015/01/21 职场文书