基于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 相关文章推荐
Array对象方法参考
Oct 03 Javascript
前端开发的开始---基于面向对象的Ajax类
Sep 17 Javascript
jquery中dom操作和事件的实例学习 下拉框应用
Dec 01 Javascript
ExtJS下 Ext.Direct加载和提交过程排错小结
Apr 02 Javascript
jQuery ReferenceError: $ is not defined 错误的处理办法
May 10 Javascript
JS 操作Array数组的方法及属性实例解析
Jan 08 Javascript
JS获取iframe中marginHeight和marginWidth属性的方法
Apr 01 Javascript
Highcharts 多个Y轴动态刷新数据的实现代码
May 28 Javascript
Jquery获取第一个子元素简单实例
Jun 02 Javascript
从源码里了解vue中的nextTick的使用
Nov 22 Javascript
JavaScript简单实现动态改变HTML内容的方法示例
Dec 25 Javascript
Vue自定义指令上报Google Analytics事件统计的方法
Feb 25 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动态创建Web站点的方法
2011/08/14 PHP
php 流程控制switch的简单实例
2016/06/07 PHP
CI框架(CodeIgniter)实现的数据库增删改查操作总结
2018/05/23 PHP
PHP7新特性
2021/03/09 PHP
Javascript valueOf 使用方法
2008/12/28 Javascript
JavaScript中的style.display属性操作
2013/03/27 Javascript
php与js的区别是什么
2013/08/05 Javascript
js左右弹性滚动对联广告代码分享
2014/02/19 Javascript
Javascript学习笔记之函数篇(四):arguments 对象
2014/11/23 Javascript
javascript跨域的方法汇总
2015/10/23 Javascript
基于JS代码实现实时显示系统时间
2016/06/16 Javascript
JS作用域深度解析
2016/12/29 Javascript
AngularJS全局警告框实现方法示例
2017/05/18 Javascript
微信小程序实现导航栏选项卡效果
2020/06/19 Javascript
vue.js在标签属性中插入变量参数的方法
2018/03/06 Javascript
layui使用数据表格实现购物车功能
2019/07/26 Javascript
Python聊天室实例程序分享
2016/01/05 Python
Python正确重载运算符的方法示例详解
2017/08/27 Python
python Opencv将图片转为字符画
2021/02/19 Python
一条命令解决mac版本python IDLE不能输入中文问题
2018/05/15 Python
Python简单获取二维数组行列数的方法示例
2018/12/21 Python
Python Flask框架扩展操作示例
2019/05/03 Python
Python判断字符串是否xx开始或结尾的示例
2019/08/08 Python
python opencv 检测移动物体并截图保存实例
2020/03/10 Python
PyQt5 文本输入框自动补全QLineEdit的实现示例
2020/05/13 Python
详解scrapy内置中间件的顺序
2020/09/28 Python
如何使用 Flask 做一个评论系统
2020/11/27 Python
python使用yaml 管理selenium元素的示例
2020/12/01 Python
WEB控件及HTML服务端控件能否调用客户端方法?如果能,请解释如何调用?
2015/08/25 面试题
Linux开机引导的步骤是什么
2015/10/19 面试题
预备党员思想汇报范文
2013/12/29 职场文书
中文专业学生自我评价范文
2014/02/06 职场文书
优秀党支部书记事迹材料
2014/05/29 职场文书
小学总务工作总结
2015/08/13 职场文书
高一军训口号
2015/12/25 职场文书
Python中的程序流程控制语句
2022/02/24 Python