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 TextBox自动完成条
Jul 22 Javascript
基于JQUERY的两个ListBox子项互相调整的实现代码
May 07 Javascript
js获取height和width的方法说明
Jan 06 Javascript
jquery实现的淡入淡出下拉菜单效果
Aug 25 Javascript
Jquery on方法绑定事件后执行多次的解决方法
Jun 02 Javascript
JS正则截取两个字符串之间及字符串前后内容的方法
Jan 06 Javascript
浅谈ajax在jquery中的请求和servlet中的响应
Jan 22 jQuery
纯JS实现可用于页码更换的飞页特效示例
May 21 Javascript
vue router 通过路由来实现切换头部标题功能
Apr 24 Javascript
JS co 函数库的含义和用法实例总结
Apr 08 Javascript
基于JS实现table导出Excel并保留样式
May 19 Javascript
解决VUE项目使用Element-ui 下拉组件的验证失效问题
Nov 07 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 文章采集正则代码
2009/12/28 PHP
微信支付开发教程(一)微信支付URL配置
2014/05/28 PHP
php将远程图片保存到本地服务器的实现代码
2015/08/03 PHP
Zend Framework教程之路由功能Zend_Controller_Router详解
2016/03/07 PHP
PHP正则表达式匹配替换与分割功能实例浅析
2017/02/04 PHP
js CSS操作方法集合
2008/10/31 Javascript
jQuery EasyUI API 中文文档 - Pagination分页
2011/09/29 Javascript
jquery处理json数据实例分析
2014/06/03 Javascript
jQuery使用drag效果实现自由拖拽div
2015/06/11 Javascript
JavaScript学习笔记整理_关于表达式和语句
2016/09/19 Javascript
详解js中call与apply关键字的作用
2016/11/21 Javascript
微信小程序中用WebStorm使用LESS
2017/03/08 Javascript
Angular 4环境准备与Angular cli创建项目详解
2017/05/27 Javascript
js实现城市级联菜单的2种方法
2017/06/23 Javascript
layui-select动态选中值的例子
2019/09/23 Javascript
解决vue cli4升级sass-loader(v8)后报错问题
2020/07/30 Javascript
[01:48]完美圣典齐天大圣至宝宣传片
2016/12/17 DOTA
python两种遍历字典(dict)的方法比较
2014/05/29 Python
用python代码做configure文件
2014/07/20 Python
python引用(import)某个模块提示没找到对应模块的解决方法
2019/01/19 Python
详解用pyecharts Geo实现动态数据热力图城市找不到问题解决
2019/06/26 Python
Django高级编程之自定义Field实现多语言
2019/07/02 Python
Python代理IP爬虫的新手使用教程
2019/09/05 Python
flask框架json数据的拿取和返回操作示例
2019/11/28 Python
Keras Convolution1D与Convolution2D区别说明
2020/05/22 Python
夏威夷灵感服装及配饰:Reyn Spooner
2018/09/18 全球购物
法国面料和小百货在线商店:Mondial Tissus
2019/03/23 全球购物
自我评价优秀范文分享
2013/11/30 职场文书
纪检监察建议书
2014/05/19 职场文书
2014年学校国庆主题活动方案
2014/09/16 职场文书
采购员岗位职责
2015/02/03 职场文书
入党积极分子党小组意见
2015/06/02 职场文书
员工升职自我评价
2019/03/26 职场文书
【HBU】数据库第四周 单表查询
2021/04/05 SQL Server
vue实现简易音乐播放器
2022/08/14 Vue.js
VMware虚拟机安装 Windows Server 2022的详细图文教程
2022/09/23 Servers