3种Jquery限制文本框只能输入数字字母的方法


Posted in Javascript onDecember 03, 2014

onlyNum(),onlyAlpha()和onlyNumAlpha()3个Jquery扩展方法

number.js

// ----------------------------------------------------------------------

// <summary>

// 限制只能输入数字

// </summary>

// ----------------------------------------------------------------------

$.fn.onlyNum = function () {

    $(this).keypress(function (event) {

        var eventObj = event || e;

        var keyCode = eventObj.keyCode || eventObj.which;

        if ((keyCode >= 48 && keyCode <= 57))

            return true;

        else

            return false;

    }).focus(function () {

    //禁用输入法

        this.style.imeMode = 'disabled';

    }).bind("paste", function () {

    //获取剪切板的内容

        var clipboard = window.clipboardData.getData("Text");

        if (/^\d+$/.test(clipboard))

            return true;

        else

            return false;

    });

};

letter.js

// ----------------------------------------------------------------------

// <summary>

// 限制只能输入字母

// </summary>

// ----------------------------------------------------------------------

$.fn.onlyAlpha = function () {

    $(this).keypress(function (event) {

        var eventObj = event || e;

        var keyCode = eventObj.keyCode || eventObj.which;

        if ((keyCode >= 65 && keyCode <= 90) || (keyCode >= 97 && keyCode <= 122))

            return true;

        else

            return false;

    }).focus(function () {

        this.style.imeMode = 'disabled';

    }).bind("paste", function () {

        var clipboard = window.clipboardData.getData("Text");

        if (/^[a-zA-Z]+$/.test(clipboard))

            return true;

        else

            return false;

    });

};

number_letter.js

// ----------------------------------------------------------------------

// <summary>

// 限制只能输入数字和字母

// </summary>

// ----------------------------------------------------------------------

$.fn.onlyNumAlpha = function () {

    $(this).keypress(function (event) {

        var eventObj = event || e;

        var keyCode = eventObj.keyCode || eventObj.which;

        if ((keyCode >= 48 && keyCode <= 57) || (keyCode >= 65 && keyCode <= 90) || (keyCode >= 97 && keyCode <= 122))

            return true;

        else

            return false;

    }).focus(function () {

        this.style.imeMode = 'disabled';

    }).bind("paste", function () {

        var clipboard = window.clipboardData.getData("Text");

        if (/^(\d|[a-zA-Z])+$/.test(clipboard))

            return true;

        else

            return false;

    });

};

use.js

$(function () {

    // 限制使用了onlyNum类样式的控件只能输入数字

    $(".onlyNum").onlyNum();

    //限制使用了onlyAlpha类样式的控件只能输入字母

    $(".onlyAlpha").onlyAlpha();

    // 限制使用了onlyNumAlpha类样式的控件只能输入数字和字母

    $(".onlyNumAlpha").onlyNumAlpha();

以上方法均可实现项目要求,大家根据自己的具体需求自由选择吧

Javascript 相关文章推荐
找到一点可怜的关于dojo资料,谢谢作者!
Dec 06 Javascript
javascript实现促销倒计时+fixed固定在底部
Sep 18 Javascript
js中如何复制一个对象并获取其所有属性和属性对应的值
Oct 24 Javascript
JavaScript实现多维数组的方法
Nov 20 Javascript
JQuery日历插件My97DatePicker日期范围限制
Jan 20 Javascript
浅谈jQuery hover(over, out)事件函数
Dec 03 Javascript
jQuery控制元素隐藏和显示
Mar 03 Javascript
javaScript中封装的各种写法示例(推荐)
Jul 03 Javascript
详解webpack3如何正确引用并使用jQuery库
Aug 26 jQuery
Vue2.0父子组件传递函数的教程详解
Oct 16 Javascript
jQuery中内容过滤器简单用法示例
Mar 31 jQuery
JS相册图片抖动放大展示效果的示例代码
Jan 29 Javascript
javascript引擎长时间独占线程造成卡顿的解决方案
Dec 03 #Javascript
javascript中clone对象详解
Dec 03 #Javascript
javascript使用正则表达式检测IP地址
Dec 03 #Javascript
Javascript快速排序算法详解
Dec 03 #Javascript
Javascript冒泡排序算法详解
Dec 03 #Javascript
Javascript堆排序算法详解
Dec 03 #Javascript
node.js下when.js 的异步编程实践
Dec 03 #Javascript
You might like
php用正则判断是否为数字的方法
2016/03/25 PHP
PHP实现权限管理功能示例
2017/09/22 PHP
PHP面向对象程序设计中的self、static、parent关键字用法分析
2019/08/14 PHP
解决laravel5.4下的group by报错的问题
2019/10/16 PHP
麦鸡的TAB切换功能结合了javascript和css
2007/12/17 Javascript
js wmp操作代码小结(音乐连播功能)
2008/11/08 Javascript
js事件(Event)知识整理
2012/10/11 Javascript
JS添加删除一组文本框并对输入信息加以验证判断其正确性
2013/04/11 Javascript
JavaScript使用Prototype实现面向对象的方法
2015/04/14 Javascript
jQuery实例—选项卡的简单实现(js源码和jQuery)
2016/06/14 Javascript
微信小程序开发实战教程之手势解锁
2016/11/18 Javascript
AngularJS中的JSONP实例解析
2016/12/01 Javascript
JS开发中基本数据类型具体有哪几种
2017/10/19 Javascript
vue组件的写法汇总
2018/04/12 Javascript
解决Layui数据表格中checkbox位置不居中的方法
2018/08/15 Javascript
vue-cli脚手架搭建的项目去除eslint验证的方法
2018/09/29 Javascript
Vuex mutitons和actions初使用详解
2019/03/04 Javascript
[01:33:25]DOTA2-DPC中国联赛 正赛 Elephant vs IG BO3 第一场 1月24日
2021/03/11 DOTA
Python描述器descriptor详解
2015/02/03 Python
Python字符串中查找子串小技巧
2015/04/10 Python
Python中装饰器高级用法详解
2017/12/25 Python
python发送邮件脚本
2018/05/22 Python
wtfPython—Python中一组有趣微妙的代码【收藏】
2018/08/31 Python
Python3.0中普通方法、类方法和静态方法的比较
2019/05/03 Python
Tensorflow--取tensorf指定列的操作方式
2020/06/30 Python
Eastbay官网:美国最大的运动鞋网络零售商
2016/07/27 全球购物
倩碧香港官方网站:Clinique香港
2017/11/13 全球购物
四下基层实施方案
2014/03/28 职场文书
我爱我校演讲稿
2014/05/21 职场文书
毕业实习自我鉴定范文2014
2014/09/26 职场文书
年终工作总结范文2014
2014/11/27 职场文书
肖申克救赎观后感
2015/06/02 职场文书
同乡会致辞
2015/07/30 职场文书
2019年怎样写好导游词?
2019/07/02 职场文书
Nginx搭建rtmp直播服务器实现代码
2021/03/31 Servers
CSS link与@import的区别和用法解析
2023/05/07 HTML / CSS