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 相关文章推荐
jQuery焦点图切换特效插件封装实例
Aug 18 Javascript
zTree插件之多选下拉菜单实例代码
Nov 06 Javascript
ECMAScript5(ES5)中bind方法使用小结
May 07 Javascript
快速掌握Node.js环境的安装与运行方法
Feb 16 Javascript
jQuery操作iframe中js函数的方法小结
Jul 06 Javascript
node.js文件上传处理示例
Oct 27 Javascript
vue模板语法-插值详解
Mar 06 Javascript
angularjs项目的页面跳转如何实现(5种方法)
May 25 Javascript
详解webpack 多入口配置
Jun 16 Javascript
vue form check 表单验证的实现代码
Dec 09 Javascript
Vue使用lodop实现打印小结
Jul 06 Javascript
微信小程序实现分页加载效果
Nov 19 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 实用代码收集
2010/01/22 PHP
ThinkPHP使用心得分享-分页类Page的用法
2014/05/15 PHP
Thinkphp+smarty+uploadify实现无刷新上传
2015/07/30 PHP
PHP中header用法小结
2016/05/23 PHP
php常用日期时间函数实例小结
2019/07/04 PHP
javascript 日历提醒系统( 兼容所有浏览器 )
2009/04/07 Javascript
javascript 当前日期转化为中文的实现代码
2010/05/13 Javascript
Javascript实现鼠标右键特色菜单
2015/08/04 Javascript
js限制文本框的输入内容代码分享(3类)
2015/08/20 Javascript
jQuery实现平滑滚动的标签分栏切换效果
2015/08/28 Javascript
js提交form表单,并传递参数的实现方法
2016/05/25 Javascript
AnjularJS中$scope和$rootScope的区别小结
2016/09/18 Javascript
JavaScript中日常收集常见的10种错误(推荐)
2017/01/08 Javascript
详谈for循环里面的break和continue语句
2017/07/20 Javascript
深入理解Vue生命周期、手动挂载及挂载子组件
2017/09/27 Javascript
浏览器调试动态js脚本的方法(图解)
2018/01/19 Javascript
[01:01:23]完美世界DOTA2联赛PWL S2 Forest vs FTD.C 第一场 11.26
2020/11/30 DOTA
CentOS7.3编译安装Python3.6.2的方法
2018/01/22 Python
numpy实现合并多维矩阵、list的扩展方法
2018/05/08 Python
Django实现分页功能
2018/07/02 Python
基于Python实现用户管理系统
2019/02/26 Python
python实现ftp文件传输功能
2020/03/20 Python
解决Jupyter NoteBook输出的图表太小看不清问题
2020/04/16 Python
Python3爬虫发送请求的知识点实例
2020/07/30 Python
Python classmethod装饰器原理及用法解析
2020/10/17 Python
几款主流好用的富文本编辑器(所见即所得常用编辑器)介绍
2021/03/17 Javascript
优秀的毕业生的自我评价
2013/12/12 职场文书
大学毕业感言一句话
2014/02/06 职场文书
党支部特色活动方案
2014/08/20 职场文书
高中教师先进事迹材料
2014/08/22 职场文书
党员群众路线自我剖析材料
2014/10/06 职场文书
2014年银行柜员工作总结
2014/11/12 职场文书
英文慰问信范文
2015/03/24 职场文书
校园歌手大赛主持词
2015/07/03 职场文书
2015年音乐教研组工作总结
2015/07/22 职场文书
Python中使用Opencv开发停车位计数器功能
2022/04/04 Python