基于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 相关文章推荐
用javascript实现读取txt文档的脚本
Jul 20 Javascript
Javascript JSQL,SQL无处不在,
May 05 Javascript
input禁止键盘及中文输入,但可以点击
Feb 13 Javascript
JS简单实现String转Date的方法
Mar 02 Javascript
JavaScript实现阿拉伯数字和中文数字互相转换
Jun 12 Javascript
浅谈JS对html标签的属性的干预以及对CSS样式表属性的干预
Jun 25 Javascript
使用JavaScript根据图片获取条形码的方法
Jul 04 Javascript
vue实现留言板todolist功能
Aug 16 Javascript
Easy UI动态树点击文字实现展开关闭功能
Sep 30 Javascript
一步步教你利用webpack如何搭一个vue脚手架(超详细讲解和注释)
Jan 08 Javascript
vuejs点击class变化的实例
Sep 05 Javascript
fastadmin中调用js的方法
May 14 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
Terran剧情介绍
2020/03/14 星际争霸
如何使用脚本模仿登陆过程
2006/11/22 PHP
PHP与SQL注入攻击[三]
2007/04/17 PHP
程序员编程十条戒律
2009/07/09 PHP
php开发留言板的CRUD(增,删,改,查)操作
2012/04/19 PHP
php使用百度翻译api示例分享
2014/01/31 PHP
控制打印时页眉角的代码
2007/02/08 Javascript
符合W3C网页标准的iframe标签的使用方法
2007/07/19 Javascript
jQuery ajax cache缓存问题
2010/07/01 Javascript
20款非常优秀的 jQuery 工具提示插件 推荐
2012/07/15 Javascript
JS实现淘宝幻灯片效果的实现方法
2013/03/22 Javascript
JavaScript sup方法入门实例(把字符串显示为上标)
2014/10/20 Javascript
jquery表单验证需要做些什么
2015/11/17 Javascript
表单中单选框添加选项和移除选项
2016/07/04 Javascript
Vue.js结合bootstrap实现分页控件
2017/03/10 Javascript
react-router实现按需加载
2017/05/09 Javascript
学习使用Bootstrap页面排版样式
2017/05/11 Javascript
BootStrap下的弹出框加载select2框架失败的解决方法
2017/08/31 Javascript
说说AngularJS中的$parse和$eval的用法
2017/09/14 Javascript
Angular(5.2->6.1)升级小结
2018/12/27 Javascript
layui的表单验证支持ajax判断用户名是否重复的实例
2019/09/06 Javascript
vue如何使用async、await实现同步请求
2019/12/09 Javascript
在vue中实现某一些路由页面隐藏导航栏的功能操作
2020/09/21 Javascript
[03:00]2014DOTA2国际邀请赛 Titan淘汰潸然泪下Ohaiyo专访
2014/07/15 DOTA
浅谈python内置变量-reversed(seq)
2017/06/21 Python
python按比例随机切分数据的实现
2019/07/11 Python
用ldap作为django后端用户登录验证的实现
2020/12/07 Python
美国最大的旗帜经销商:Carrot-Top
2018/02/26 全球购物
navabi英国:设计师大码女装
2019/06/25 全球购物
人力资源经理的岗位职责范本
2014/02/28 职场文书
优秀毕业生找工作自荐信
2014/06/23 职场文书
暑期学习心得体会
2014/09/02 职场文书
总经理司机岗位职责
2015/04/10 职场文书
2016大学生诚信考试承诺书
2016/03/25 职场文书
python实现Nao机器人的单目测距
2021/09/04 Python
详解OpenCV曝光融合
2022/04/29 Python