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 相关文章推荐
IE不支持getElementsByClassName最终完美解决方案
Dec 17 Javascript
如何制作浮动广告 JavaScript制作浮动广告代码
Dec 30 Javascript
引用 js在IE与FF之间的区别详细解析
Nov 20 Javascript
手机号码,密码正则验证
Sep 04 Javascript
JavaScript中document对象使用详解
Jan 06 Javascript
JQuery创建DOM节点的方法
Jun 11 Javascript
检查表单元素的值是否为空的实例代码
Jun 16 Javascript
jQuery实现按比例缩放图片的方法
Apr 29 jQuery
微信小程序数据存储与取值详解
Jan 30 Javascript
vue中element组件样式修改无效的解决方法
Feb 03 Javascript
jquery.pagination.js分页使用教程
Oct 23 jQuery
解决layui轮播图有数据不显示的情况
Sep 16 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
使用Apache的htaccess防止图片被盗链的解决方法
2013/04/27 PHP
php实现最简单的MVC框架实例教程
2014/09/08 PHP
php将字符串全部转换成大写或者小写的方法
2015/03/17 PHP
php实现粘贴截图并完成上传功能
2015/05/17 PHP
Symfony学习十分钟入门经典教程
2016/02/03 PHP
总结对比php中的多种序列化
2016/08/28 PHP
jquery复选框CHECKBOX全选、反选
2008/08/30 Javascript
firefox下对ajax的onreadystatechange的支持情况分析
2009/12/14 Javascript
Javascript模块化编程(三)require.js的用法及功能介绍
2013/01/17 Javascript
javascript递归回溯法解八皇后问题
2015/04/22 Javascript
使用JavaScript判断手机浏览器是横屏还是竖屏问题
2016/08/02 Javascript
深入理解JavaScript中的for循环
2017/02/07 Javascript
Vue2.0父子组件传递函数的教程详解
2017/10/16 Javascript
vue中的event bus非父子组件通信解析
2017/10/27 Javascript
react 应用多入口配置及实践总结
2018/10/17 Javascript
解决vue 界面在苹果手机上滑动点击事件等卡顿问题
2018/11/27 Javascript
对vue生命周期的深入理解
2020/12/03 Vue.js
[06:25]第二届DOTA2亚洲邀请赛主赛事第二天比赛集锦.mp4
2017/04/03 DOTA
python的正则表达式re模块的常用方法
2013/03/09 Python
python利用dir函数查看类中所有成员函数示例代码
2017/09/08 Python
python中退出多层循环的方法
2018/11/27 Python
Python容器使用的5个技巧和2个误区总结
2019/09/26 Python
python调用Matplotlib绘制分布点图
2019/10/18 Python
css3让div随鼠标移动而抖动起来
2014/02/10 HTML / CSS
亚马逊墨西哥站:Amazon.com.mx
2018/08/26 全球购物
Doyoueven官网:澳大利亚健身服饰和配饰品牌
2019/03/24 全球购物
美国浴缸、水槽和水龙头购物网站:Vintage Tub & Bath
2019/11/05 全球购物
新电JAVA笔试题目
2014/08/31 面试题
家长会演讲稿范文
2014/01/10 职场文书
升旗仪式主持词
2014/03/19 职场文书
专家推荐信模板
2014/05/09 职场文书
村党支部书记个人对照材料汇报
2014/10/26 职场文书
2015年业务员工作总结范文
2015/04/07 职场文书
单位政审意见范文
2015/06/04 职场文书
Python利器openpyxl之操作excel表格
2021/04/17 Python
Python如何导出导入所有依赖包详解
2021/06/08 Python