编程 Javascript

javascript限制文本框输入值类型的方法

Posted in Javascript onMay 07, 2015

本文实例讲述了javascript限制文本框输入值类型的方法。分享给大家供大家参考。具体分析如下：

要求：所有的文本框，只能输入数字和小数点，其他的符号一概不能输入；

重点是我希望在用户输入时就做限制，而不是提交时判断——也就是说如果用户在文本框内输入数字或小数点，可以正常输入；如果输入字母等非数字字符，则文本框会没有任何反应，不会显示输入的字符。

<html>
<body>
<script>
var s = "<input type=\"text\" size=\"20\" " +
"style=\"text-align:center\" " +
"onkeydown=\"if(event.keyCode>57&&event.keyCode!=190) return false\" "+ 
//限制只能输入数字
"onblur=\"value=value.replace(/[^0-9\.]/g,'')\" " + 
//限制鼠标点击输入非数字
"onbeforepaste=\"clipboardData.setData(\"text\"," + 
//限制只能粘贴数字
"clipboardData.getData(\"text\").replace(/[^0-9\.]/g,''))\">";
document.write(s);
</script>
</body>
</html>

希望本文所述对大家的javascript程序设计有所帮助。

javascript限制文本框输入值类型的方法

- Author -

shichen2014

声明：登载此文出于传递更多信息之目的，并不意味着赞同其观点或证实其描述。

Javascript 相关文章推荐

JavaScript中字符串分割函数split用法实例

Apr 07 Javascript

Angular工具方法学习

Dec 26 Javascript

Angular2 PrimeNG分页模块学习

Jan 14 Javascript

js date 格式化

Feb 15 Javascript

详解create-react-app 自定义 eslint 配置

Jun 07 Javascript

详解vue文件中使用echarts.js的两种方式

Oct 18 Javascript

浅谈Vue.use到底是什么鬼

Jan 21 Javascript

JS实现页面数据懒加载

Feb 13 Javascript

es6中class类静态方法，静态属性，实例属性，实例方法的理解与应用分析

Feb 15 Javascript

javascript实现滚动条效果

Mar 24 Javascript

深度解读vue-resize的具体用法

Jul 08 Javascript

Vue实现移动端拖拽交换位置

Jul 29 Javascript

浅谈Javascript的静态属性和原型属性

May 07 #Javascript

ECMAScript5(ES5)中bind方法使用小结

May 07 #Javascript

JS中获取函数调用链所有参数的方法

May 07 #Javascript

jQuery中animate动画第二次点击事件没反应

May 07 #Javascript

js实现鼠标滑过文字链接色彩变化的效果

May 06 #Javascript

JS实现文字掉落效果的方法

May 06 #Javascript

DOM 高级编程

May 06 #Javascript

You might like

如何让thinkphp在模型中自动完成session赋值小教程

2014/09/05 PHP

关于php unset对json_encode的影响详解

2018/11/14 PHP

Laravel定时任务的每秒执行代码

2019/10/22 PHP

不错的asp中显示新闻的功能

2006/10/13 Javascript

学习YUI.Ext基础第一天

2007/03/10 Javascript

Jquery上传插件 uploadify v3.1使用说明

2012/06/18 Javascript

用box固定长宽实现图片自动轮播js代码

2014/06/09 Javascript

详解javascript new的运行机制

2016/01/26 Javascript

详解vue-router基本使用

2017/04/18 Javascript

JavaScript定时器setTimeout()和setInterval()详解

2017/08/18 Javascript

Nodejs+angularjs结合multiparty实现多图片上传的示例代码

2017/09/29 NodeJs

JavaScript使用类似break机制中断forEach循环的方法

2018/11/13 Javascript

vue 中命名视图的用法实例详解

2019/08/14 Javascript

使用layui日期控件laydate对开始和结束时间进行联动控制的方法

2019/09/06 Javascript

webpack常用配置总览(小结)

2019/11/18 Javascript

微信小程序后端无法保持session的原因及解决办法问题

2020/03/20 Javascript

用jQuery实现抽奖程序

2020/04/12 jQuery

[01:06]DOTA2小知识课堂 Ep.02 吹风竟可解梦境缠绕

2019/12/05 DOTA

flask中使用SQLAlchemy进行辅助开发的代码

2013/02/10 Python

Python实现读取目录所有文件的文件名并保存到txt文件代码

2014/11/22 Python

Python socket网络编程TCP/IP服务器与客户端通信

2017/01/05 Python

Python利用matplotlib.pyplot绘图时如何设置坐标轴刻度

2018/04/09 Python

Python高级特性切片(Slice)操作详解

2018/09/27 Python

python爬虫 requests-html的使用

2020/11/30 Python

CSS3实现王者荣耀匹配人员加载页面的方法

2019/04/16 HTML / CSS

HTML5新特性之type=file文件上传功能

2018/02/02 HTML / CSS

阿拉伯世界最大的电子商务网站：Souq沙特阿拉伯

2016/10/28 全球购物

苏格兰在线威士忌商店：The Whisky Barrel

2019/05/07 全球购物

个人实用简单的自我评价

2013/10/19 职场文书

大课间活动实施方案

2014/03/06 职场文书

书香家庭事迹材料

2014/05/09 职场文书

酒店人事主管岗位职责

2015/04/11 职场文书

党支部审查意见

2015/06/02 职场文书

音乐研修感悟

2015/11/18 职场文书

Oracle以逗号分隔的字符串拆分为多行数据实例详解

2021/07/16 Oracle

浅谈Java父子类加载顺序

2021/08/04 Java/Android