基于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 学习历程和心得分享
Dec 12 Javascript
js判断设备是否为PC并调整图片大小
Feb 12 Javascript
jquery实现checkbox 全选/全不选的通用写法
Feb 22 Javascript
JavaScript中toString()方法的使用详解
Jun 05 Javascript
AngularJS中如何使用$parse或$eval在运行时对Scope变量赋值
Jan 25 Javascript
jQuery实现优雅的弹窗效果(6)
Feb 08 Javascript
jQuery基于事件控制实现点击显示内容下拉效果
Mar 07 Javascript
原生JS实现DOM加载完成马上执行JS代码的方法
Sep 07 Javascript
JavaScript在web自动化测试中的作用示例详解
Aug 25 Javascript
JS异步处理的进化史深入讲解
Aug 25 Javascript
如何用vue-cli3脚手架搭建一个基于ts的基础脚手架的方法
Dec 12 Javascript
html5以及jQuery实现本地图片上传前的预览代码实例讲解
Mar 01 jQuery
编写自己的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
同时提取多条新闻中的文本一例
2006/10/09 PHP
在PHP3中实现SESSION的功能(一)
2006/10/09 PHP
php array的学习笔记
2012/05/10 PHP
php5.2 Json不能正确处理中文、GB编码的解决方法
2014/03/28 PHP
PHP中cookie和session的区别实例分析
2014/08/28 PHP
thinkphp3.0输出重复两次的解决方法
2014/12/19 PHP
php实现基于微信公众平台开发SDK(demo)扩展的方法
2014/12/22 PHP
php通过array_merge()函数合并两个数组的方法
2015/03/18 PHP
PHP微信红包生成代码分享
2016/10/06 PHP
js几个不错的函数 $$()
2006/10/09 Javascript
web页面数据展示新想法(json)
2010/06/08 Javascript
实现变速回到顶部的JavaScript代码
2011/05/09 Javascript
关闭页面window.location事件未执行的原因及解决方法
2014/09/01 Javascript
JQuery表单验证插件EasyValidator用法分析
2014/11/15 Javascript
浅谈jQuery中replace()方法
2015/05/13 Javascript
使用Meteor配合Node.js编写实时聊天应用的范例
2015/06/23 Javascript
基于Three.js插件制作360度全景图
2016/11/29 Javascript
vue.js整合mint-ui里的轮播图实例代码
2017/12/27 Javascript
vue.js element-ui tree树形控件改iview的方法
2018/03/29 Javascript
JavaScript创建表格的方法
2020/04/13 Javascript
vue下canvas裁剪图片实例讲解
2020/04/16 Javascript
浅谈JavaScript窗体Window.ShowModalDialog使用
2020/07/22 Javascript
python实现多线程的两种方式
2016/05/22 Python
python 实现红包随机生成算法的简单实例
2017/01/04 Python
python多线程socket编程之多客户端接入
2017/09/12 Python
django manage.py扩展自定义命令方法
2018/05/27 Python
python实现抖音视频批量下载
2018/06/20 Python
Python字符串内置函数功能与用法总结
2019/04/16 Python
使用Python发现隐藏的wifi
2020/03/04 Python
解决python中显示图片的plt.imshow plt.show()内存泄漏问题
2020/04/24 Python
canvas实现飞机打怪兽射击小游戏的示例代码
2018/07/09 HTML / CSS
中国排名第一的外贸销售网站:LightInTheBox.com(兰亭集势)
2016/10/28 全球购物
日本化妆品植村秀俄罗斯官方网站:Shu Uemura俄罗斯
2020/02/01 全球购物
六年级学生评语
2014/04/22 职场文书
投标人法定代表人授权委托书格式
2014/09/28 职场文书
求职信如何撰写?
2019/05/22 职场文书