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+css实现图片滚动效果(附源码)
Mar 18 Javascript
Javascript原型链和原型的一个误区
Oct 22 Javascript
移动设备web开发首选框架:zeptojs介绍
Jan 29 Javascript
常用的JavaScript WEB操作方法分享
Feb 28 Javascript
新入门node.js必须要知道的概念(必看篇)
Aug 10 Javascript
JavaScript reduce和reduceRight详解
Oct 24 Javascript
JS中用三种方式实现导航菜单中的二级下拉菜单
Oct 31 Javascript
js中Number数字数值运算后值不对的解决方法
Feb 28 Javascript
js制作简单的音乐播放器的示例代码
Aug 28 Javascript
Bootstrap 树控件使用经验分享(图文解说)
Nov 06 Javascript
微信小程序左滑删除实现代码实例
Sep 16 Javascript
小程序中的箭头函数的具体使用
Jun 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/08/26 PHP
PHP操作数组相关函数
2011/02/03 PHP
php数据结构与算法(PHP描述) 查找与二分法查找
2012/06/21 PHP
CI框架Session.php源码分析
2014/11/03 PHP
SWFObject Flash js调用类
2008/07/08 Javascript
用于判断用户注册时,密码强度的JS代码
2009/01/01 Javascript
JavaScript常用全局属性与方法记录积累
2013/07/03 Javascript
js设置cookie过期当前时间减去一秒相当于立即过期
2014/09/04 Javascript
JavaScript实现获得所有兄弟节点的方法
2015/07/23 Javascript
jQuery.datatables.js插件用法及api实例详解
2016/10/28 Javascript
bootstrap table表格使用方法详解
2017/04/26 Javascript
浅谈react+es6+webpack的基础配置
2017/08/09 Javascript
React Native中的RefreshContorl下拉刷新使用
2017/10/09 Javascript
JavaScript+H5实现微信摇一摇功能
2018/05/23 Javascript
vue项目中实现图片预览的公用组件功能
2018/10/26 Javascript
微信小程序获取用户绑定手机号方法示例
2019/07/21 Javascript
JavaScript隐式类型转换代码实例
2020/05/29 Javascript
python多线程扫描端口示例
2014/01/16 Python
python获取图片颜色信息的方法
2015/03/18 Python
Python实现获取域名所用服务器的真实IP
2015/10/25 Python
Python sorted函数详解(高级篇)
2018/09/18 Python
python画图——实现在图上标注上具体数值的方法
2019/07/08 Python
Python 批量刷博客园访问量脚本过程解析
2019/08/30 Python
利用django创建一个简易的博客网站的示例
2020/09/29 Python
详解如何使用Pytest进行自动化测试
2021/01/14 Python
python爬虫scrapy框架的梨视频案例解析
2021/02/20 Python
英国玛莎百货新西兰:Marks & Spencer New Zealand
2019/07/21 全球购物
GOLFINO英国官网:高尔夫服装
2020/04/11 全球购物
Happy Plugs官网:瑞典无线耳机品牌
2020/07/16 全球购物
经管应届生求职信
2013/11/17 职场文书
运动会演讲稿200字
2014/08/25 职场文书
实习介绍信模板
2015/01/30 职场文书
2016年3月份红领巾广播稿
2015/12/21 职场文书
java高级用法JNA强大的Memory和Pointer
2022/04/19 Java/Android
CentOS7安装MySQL8的超级详细教程(无坑!)
2022/06/10 Servers
windows server2012 R2下安装PaddleOCR服务的的详细步骤
2022/09/23 Servers