基于jquery的设置页面文本框 只能输入数字的实现代码


Posted in Javascript onApril 19, 2011

代码如下:

$("#money").bind("propertychange",function() { 
if(""!=this.value){ 
var str = this.value.replace(/(^\s*)|(\s*$)/g, ""); 
if(this.value != str ) 
this.value = str; 
} 
if( isNaN(Number(this.value))) 
this.value = this.value.replace(/[\D]/,''); 
});

这里使用了JQuery绑定到id为money的文本框的onpropertychange事件上。
下面的代码连小数点也屏蔽掉了
$("#phone").bind("propertychange", function() { 
if(""!=this.value){ 
var str = this.value.replace(/(^\s*)|(\s*$)/g, ""); 
if(this.value != str ) 
this.value = str; 
} 
if (this.value.indexOf('.') != -1) { 
this.value = this.value.replace(/[\.]/, ''); 
this.focus(); } 
if (isNaN(Number(this.value))) { 
this.value = ($.trim(this.value)).replace(/[\D]/, ''); 
this.focus(); } });

最后,最好将输入法屏蔽掉。 通过css,ime-mode:disabled就可以实现。
如果很严格的话,可以再追加上禁止粘贴与拖拽。
禁止粘贴与拖拽实现方法
文本框禁止拖拽和粘贴

在css中实现文本框禁止拖拽和粘贴的功能

建立一个Css,如下:

.TextBox_NotDragpaste { 
ondragenter:expression(ondragenter=function(){return false;}); 
onpaste:expression(onpaste=function(){return false;}); 
}

如果还需要禁止输入中文的功能只需要多加一个语句即可。

如下:

.TextBox_NotDragpaste { 
ime-mode:disabled; 
ondragenter:expression(ondragenter=function(){return false;}); 
onpaste:expression(onpaste=function(){return false;}); 
}
Javascript 相关文章推荐
兼容IE和Firefox火狐的上下、左右循环无间断滚动JS代码
Apr 19 Javascript
jQuery过滤选择器详解
Jan 13 Javascript
jQuery实现仿腾讯迷你首页选项卡效果代码
Sep 17 Javascript
基于JS实现PHP的sprintf函数实例
Nov 14 Javascript
JQuery学习总结【一】
Dec 01 Javascript
Angularjs按需查询实例代码
Oct 30 Javascript
详解如何实现一个简单的 vuex
Feb 10 Javascript
手把手教你vue-cli单页到多页应用的方法
May 31 Javascript
Vue中"This dependency was not found"问题的解决方法
Jun 19 Javascript
js中的reduce()函数讲解
Jan 18 Javascript
对layui数据表格动态cols(字段)动态变化详解
Oct 25 Javascript
JS指定音频audio在某个时间点进行播放
Nov 28 Javascript
编写自己的jQuery插件简单实现代码
Apr 19 #Javascript
提升你网站水平的jQuery插件集合推荐
Apr 19 #Javascript
分享20款好玩的jQuery游戏
Apr 17 #Javascript
ModelDialog JavaScript模态对话框类代码
Apr 17 #Javascript
JavaScript中的isXX系列是否继续使用的分析
Apr 16 #Javascript
EXTJS FORM HIDDEN TEXTFIELD 赋值 使用value不好用的问题
Apr 16 #Javascript
表单JS弹出填写提示效果代码
Apr 16 #Javascript
You might like
php学习笔记 php中面向对象三大特性之一[封装性]的应用
2011/06/13 PHP
解析php通过cookies获取远程网页的指定代码
2013/06/25 PHP
PHPAnalysis中文分词类详解
2014/06/13 PHP
PHP基于redis计数器类定义与用法示例
2018/02/08 PHP
javascript中this做事件参数相关问题解答
2013/03/17 Javascript
window.onresize 多次触发的解决方法
2013/11/08 Javascript
JS获取IP、MAC和主机名的五种方法
2013/11/14 Javascript
用javascript读取xml文件读取节点数据
2014/08/12 Javascript
JavaScript中instanceof运算符的使用示例
2016/06/08 Javascript
用JS写的一个Ajax库(实例代码)
2016/08/06 Javascript
javascript动画之模拟拖拽效果篇
2016/09/26 Javascript
原生js实现淘宝购物车功能
2020/06/23 Javascript
十大热门的JavaScript框架和库
2017/03/21 Javascript
nodejs个人博客开发第六步 数据分页
2017/04/12 NodeJs
JS判断时间段的实现代码
2017/06/14 Javascript
Vue学习笔记进阶篇之多元素及多组件过渡
2017/07/19 Javascript
对angularJs中自定义指令replace的属性详解
2018/10/09 Javascript
Javascript中绑定click事件的四种方式介绍
2018/10/26 Javascript
微信小程序实现自动定位功能
2018/10/31 Javascript
vue 地图可视化 maptalks 篇实例代码详解
2019/05/21 Javascript
[59:30]VG vs LGD 2019国际邀请赛淘汰赛 胜者组 BO3 第二场 8.22
2019/09/05 DOTA
python操作redis的方法
2015/07/07 Python
Python 给屏幕打印信息加上颜色的实现方法
2019/04/24 Python
python实现PID算法及测试的例子
2019/08/08 Python
python时间日期操作方法实例小结
2020/02/06 Python
基于python的docx模块处理word和WPS的docx格式文件方式
2020/02/13 Python
matlab中二维插值函数interp2的使用详解
2020/04/22 Python
HTML5 canvas画图并保存成图片的jcanvas插件
2014/01/17 HTML / CSS
HTML5新特性 多线程(Worker SharedWorker)
2017/04/24 HTML / CSS
事务机电主管工作职责
2014/02/25 职场文书
农村改厕实施方案
2014/03/22 职场文书
优秀家长自荐材料
2014/08/26 职场文书
工作时间擅自离岗检讨书
2014/10/24 职场文书
工程款催款函
2015/06/24 职场文书
canvas多重阴影发光效果实现
2021/04/20 Javascript
vue组件vue-esign实现电子签名
2022/04/21 Vue.js