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 相关文章推荐
javascript 特性检测并非浏览器检测
Jan 15 Javascript
Javascript中Eval函数的使用
Mar 23 Javascript
JQuery中两个ul标签的li互相移动实现方法
May 18 Javascript
jquery实现的Accordion折叠面板效果代码
Sep 02 Javascript
详解JavaScript中的Unescape()和String() 函数
Nov 09 Javascript
详解前端自动化工具gulp自动添加版本号
Dec 20 Javascript
纯js模仿windows系统日历
Feb 04 Javascript
微信小程序icon组件使用详解
Jan 31 Javascript
js实现敏感词过滤算法及实现逻辑
Jul 24 Javascript
如何使用pm2快速将项目部署到远程服务器
Mar 12 Javascript
JavaScript变速动画函数封装添加任意多个属性
Apr 03 Javascript
使用imba.io框架得到比 vue 快50倍的性能基准
Jun 17 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脚本清除WordPress头部冗余代码的方法讲解
2016/03/01 PHP
Yii视图操作之自定义分页实现方法
2016/07/14 PHP
JQuery 学习笔记 element属性控制
2009/07/23 Javascript
深入理解JavaScript系列(16) 闭包(Closures)
2012/04/12 Javascript
JavaScript语言核心数据类型和变量使用介绍
2013/08/23 Javascript
node.js应用后台守护进程管理器Forever安装和使用实例
2014/06/01 Javascript
JavaScript中number转换成string介绍
2014/12/31 Javascript
javascript属性访问表达式用法分析
2015/04/25 Javascript
jquery实现select选择框内容左右移动代码分享
2015/11/21 Javascript
微信小程序 wx.request(接口调用方式)详解及实例
2016/11/23 Javascript
jquery 手势密码插件
2017/03/17 Javascript
JavaScript面向对象的程序设计(犯迷糊的小羊)
2018/05/27 Javascript
实例分析编写vue组件方法
2019/02/12 Javascript
详解vue 路由跳转四种方式 (带参数)
2019/04/28 Javascript
实例详解vue中的$root和$parent
2019/04/29 Javascript
vue中get请求如何传递数组参数的方法示例
2019/11/08 Javascript
微信小程序之导航滑块视图容器功能的实现代码(简单两步)
2020/06/19 Javascript
Python cookbook(数据结构与算法)根据字段将记录分组操作示例
2018/03/19 Python
python判断列表的连续数字范围并分块的方法
2018/11/16 Python
在python中利用numpy求解多项式以及多项式拟合的方法
2019/07/03 Python
在django中图片上传的格式校验及大小方法
2019/07/28 Python
keras训练浅层卷积网络并保存和加载模型实例
2020/07/02 Python
python 进程池pool使用详解
2020/10/15 Python
新西兰廉价汽车租赁:Snap Rentals
2018/09/14 全球购物
工程材料采购方案
2014/05/18 职场文书
护理专业求职信
2014/06/15 职场文书
志愿者活动总结报告
2014/06/27 职场文书
应聘教师求职信
2014/07/19 职场文书
市场营销专业毕业生求职信
2014/07/21 职场文书
地质工程专业毕业生求职信
2014/08/08 职场文书
营销与策划实训报告
2014/11/05 职场文书
党的群众路线学习笔记
2014/11/06 职场文书
我的长征观后感
2015/06/09 职场文书
2015年小学体育教师工作总结
2015/10/23 职场文书
24句精辟的现实社会语录,句句扎心,道尽人性
2019/08/29 职场文书
一次SQL查询优化原理分析(900W+数据从17s到300ms)
2022/06/10 SQL Server