基于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 相关文章推荐
jquery 简单导航实现代码
Sep 11 Javascript
在浏览器窗口上添加遮罩层的方法
Nov 12 Javascript
jQuery写的日历(包括日历的样式及功能)
Apr 23 Javascript
$.each遍历对象、数组的属性值并进行处理
Jul 18 Javascript
js实现的全国省市二级联动下拉选择菜单完整实例
Aug 17 Javascript
JS二叉树的简单实现方法示例
Apr 05 Javascript
Vue组件化通讯的实例代码
Jun 23 Javascript
Node.js如何实现注册邮箱激活功能 (常见)
Jul 23 Javascript
vue-cli配置环境变量的方法
Jul 09 Javascript
element-ui 时间选择器限制范围的实现(随动)
Jan 09 Javascript
微信小程序实现授权登录
May 15 Javascript
如何使用 vue-cli 创建模板项目
Nov 19 Vue.js
编写自己的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 json与xml序列化/反序列化
2013/10/28 PHP
PHP将两个关联数组合并函数提高函数效率
2014/03/18 PHP
PHP实现简单实用的验证码类
2015/07/29 PHP
使用PHP生成图片的缩略图的方法
2015/08/18 PHP
PHP实现HTML页面静态化的方法
2015/11/04 PHP
实例:用 JavaScript 来操作字符串(一些字符串函数)
2007/02/15 Javascript
用jQuery技术实现Tab页界面之二
2009/09/21 Javascript
jQuery获取Radio,CheckBox选择的Value值(示例代码)
2013/12/12 Javascript
js实现按钮加背景图片常用方法
2014/11/01 Javascript
JavaScript实现Iterator模式实例分析
2015/06/09 Javascript
angularjs学习笔记之完整的项目结构
2015/09/26 Javascript
jQuery实现导航高亮的方法【附demo源码下载】
2016/11/09 Javascript
原生Javascript插件开发实践
2017/01/18 Javascript
JS中如何实现点击a标签返回页面顶部的问题
2017/01/19 Javascript
Nodejs 获取时间加手机标识的32位标识实现代码
2017/03/07 NodeJs
vue实现移动端轻量日期组件不依赖第三方库的方法
2019/04/28 Javascript
Python中基础的socket编程实战攻略
2016/06/01 Python
利用Python实现在同一网络中的本地文件共享方法
2018/06/04 Python
python中的插值 scipy-interp的实现代码
2018/07/23 Python
Python基于plotly模块实现的画图操作示例
2019/01/23 Python
通过python爬虫赚钱的方法
2019/01/29 Python
Python参数解析模块sys、getopt、argparse使用与对比分析
2019/04/02 Python
python下的opencv画矩形和文字注释的实现方法
2019/07/09 Python
scikit-learn线性回归,多元回归,多项式回归的实现
2019/08/29 Python
Python操作SQLite数据库过程解析
2019/09/02 Python
python3 mmh3安装及使用方法
2019/10/09 Python
解决Jupyter NoteBook输出的图表太小看不清问题
2020/04/16 Python
Python中的Cookie模块如何使用
2020/06/04 Python
舞蹈教育学专业推荐信
2013/11/27 职场文书
总经理文秘岗位职责
2014/02/03 职场文书
银行简历自我评价
2014/02/11 职场文书
学校做一个有道德的人活动方案
2014/08/23 职场文书
合伙经营协议书范本
2014/09/13 职场文书
车队安全员岗位职责
2015/02/15 职场文书
清明节寄语2015
2015/03/23 职场文书
小学感恩主题班会
2015/08/12 职场文书