编程 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 相关文章推荐

jQuery 页面载入进度条实现代码

Feb 08 Javascript

在JavaScript中获取请求的URL参数

Dec 22 Javascript

Javascript图像处理—亮度对比度应用案例

Jan 03 Javascript

探析浏览器执行JavaScript脚本加载与代码执行顺序

Jan 12 Javascript

bootstrap3-dialog-master模态框使用详解

Aug 22 Javascript

原生js实现仿window10系统日历效果的实例

Oct 31 Javascript

JS笛卡尔积算法与多重数组笛卡尔积实现方法示例

Dec 01 Javascript

开发Vue树形组件的示例代码

Dec 21 Javascript

React教程之封装一个Portal可复用组件的方法

Jan 02 Javascript

js的新生代垃圾回收知识点总结

Aug 22 Javascript

layui: layer.open加载窗体时出现遮罩层的解决方法

Sep 26 Javascript

详解webpack的文件监听实现(热更新)

Sep 11 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

php巧获服务器端信息

2006/12/06 PHP

PHP 自定义错误处理函数trigger_error()

2013/03/26 PHP

PHP加Nginx实现动态裁剪图片方案

2014/03/10 PHP

CI框架学习笔记（二） -入口文件index.php

2014/10/27 PHP

基础的WordPress插件制作教程

2015/11/24 PHP

PHP中的异常处理机制深入讲解

2020/11/10 PHP

JQuery 写的个性导航菜单

2009/12/24 Javascript

js全屏显示显示代码的三种方法

2013/11/11 Javascript

js禁止回车提交表单的示例代码

2013/12/23 Javascript

浅谈javascript回调函数

2014/12/07 Javascript

jQuery前端分页示例分享

2015/02/10 Javascript

jQuery结合AJAX之在页面滚动时从服务器加载数据

2015/06/30 Javascript

js实现仿MSN带关闭功能的右下角弹窗代码

2015/09/04 Javascript

如何在Angular2中使用jQuery及其插件的方法

2017/02/09 Javascript

详解JavaScript对象的深浅复制

2017/03/30 Javascript

详解webpack 如何集成第三方js库

2017/06/29 Javascript

收集前端面试题之url、href、src

2018/03/22 Javascript

jQuery实现checkbox全选功能完整实例

2018/07/12 jQuery

从零开始用electron手撸一个截屏工具的示例代码

2018/10/10 Javascript

vue悬浮可拖拽悬浮按钮的实例代码

2019/08/20 Javascript

vue 兄弟组件的信息传递的方法实例详解

2019/08/30 Javascript

Vue将props值实时传递并可修改的操作

2020/08/09 Javascript

[00:43]FTP典藏礼包 DOTA2三大英雄霸气新套装

2014/03/21 DOTA

讲解Python中的递归函数

2015/04/27 Python

Python 绘图和可视化详细介绍

2017/02/11 Python

Python预测2020高考分数和录取情况

2020/07/08 Python

详解python安装matplotlib库三种失败情况

2020/07/28 Python

python 基于selenium实现鼠标拖拽功能

2020/12/24 Python

浅谈CSS3 box-sizing 属性有趣的盒模型

2019/04/02 HTML / CSS

美国知名的在线旅游服务网站：Priceline

2016/07/23 全球购物

英国最大的在线照明商店：Litecraft

2020/08/31 全球购物

幼儿园亲子活动方案

2014/01/29 职场文书

电子商务专业应届生求职信

2014/05/28 职场文书

2014年售后服务工作总结

2014/11/18 职场文书

初中班级口号霸气押韵

2015/12/24 职场文书

2019最新劳动仲裁申请书！

2019/07/08 职场文书