基于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 相关文章推荐
js直接编辑当前cookie的脚本
Sep 14 Javascript
JQuery SELECT单选模拟jQuery.select.js
Nov 12 Javascript
JQuery,Extjs,YUI,Prototype,Dojo 等JS框架的区别和应用场景简述
Apr 15 Javascript
javascript中substr,substring,slice.splice的区别说明
Nov 25 Javascript
利用javascript实现全部删或清空所选的操作
May 27 Javascript
JavaScript学习笔记之基础语法
Jan 22 Javascript
JavaScript实现获取dom中class的方法
Feb 09 Javascript
使用Node.js配合Nginx实现高负载网络
Jun 28 Javascript
AngularJS基础 ng-hide 指令用法及示例代码
Aug 01 Javascript
JavaScript实现左侧菜单效果
Dec 14 Javascript
jquery更改元素属性attr()方法操作示例
May 22 jQuery
5个你不知道的JavaScript字符串处理库(小结)
Jun 01 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原创论坛
2006/10/09 PHP
php动态生成函数示例
2014/03/21 PHP
Yii 快速,安全,专业的PHP框架
2014/09/03 PHP
PHP中file_exists()判断中文文件名无效的解决方法
2014/11/12 PHP
smarty循环嵌套用法示例分析
2016/07/19 PHP
PHP生成图片验证码功能示例
2017/01/12 PHP
用Jquery实现滚动新闻
2014/02/12 Javascript
JS+CSS实现Li列表隔行换色效果的方法
2015/02/16 Javascript
javasript实现密码的隐藏与显示
2015/05/08 Javascript
浅谈Node.js中的定时器
2015/06/18 Javascript
JS实现生成会变大变小的圆环实例
2015/08/05 Javascript
AngularJS入门教程之更多模板详解
2016/08/19 Javascript
数组Array的排序sort方法
2017/02/17 Javascript
React学习笔记之事件处理(二)
2017/07/02 Javascript
Vue 组件封装 并使用 NPM 发布的教程
2018/09/30 Javascript
vue移动端的左右滑动事件详解
2020/06/17 Javascript
Vue和React有哪些区别
2020/09/12 Javascript
Python re模块介绍
2014/11/30 Python
Python编程之string相关操作实例详解
2017/07/22 Python
神经网络python源码分享
2017/12/15 Python
Python聊天室程序(基础版)
2018/04/01 Python
python实现RabbitMQ的消息队列的示例代码
2018/11/08 Python
python实现在线翻译功能
2020/03/03 Python
Python包和模块的分发详细介绍
2020/06/19 Python
如何使用pycharm连接Databricks的步骤详解
2020/09/23 Python
CSS3 box-sizing属性
2009/04/17 HTML / CSS
奇怪的鱼:Weird Fish
2018/03/18 全球购物
Calphalon美国官网:美国顶级锅具品牌
2020/02/05 全球购物
设计毕业生简历中的自我评价
2013/10/01 职场文书
幼儿园教师教学反思
2014/02/06 职场文书
群众路线剖析材料
2014/09/30 职场文书
党员批评与自我批评
2014/10/15 职场文书
巾帼文明岗汇报材料
2014/12/24 职场文书
社区国庆节活动总结
2015/03/23 职场文书
全国劳模先进事迹材料(2016精选版)
2016/02/25 职场文书
使用Python开发贪吃蛇游戏 SnakeGame
2022/04/30 Python