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中清空数组的三种方法分享
Apr 07 Javascript
javascript教程之不完整的继承(js原型链)
Jan 13 Javascript
JavaScript控制各种浏览器全屏模式的方法、属性和事件介绍
Apr 03 Javascript
JQuery教学之性能优化
May 14 Javascript
Javascript检查图片大小不要让大图片撑破页面
Nov 04 Javascript
超炫的jquery仿flash导航栏特效
Nov 11 Javascript
node.js中的favicon.ico请求问题处理
Dec 15 Javascript
JavaScript操作选择对象的简单实例
May 16 Javascript
bootstrap daterangepicker汉化以及扩展功能
Jun 15 Javascript
javaScript封装的各种写法
Aug 14 Javascript
vue-cli与webpack处理静态资源的方法及webpack打包的坑
May 15 Javascript
node.js事件轮询机制原理知识点
Dec 22 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
WINXP下apache+php4+mysql
2006/11/25 PHP
学习php笔记 字符串处理
2010/10/19 PHP
项目中应用Redis+Php的场景
2016/05/22 PHP
JQuery live函数
2010/12/24 Javascript
js循环改变div颜色具体方法
2013/06/25 Javascript
javascript怎么禁用浏览器后退按钮
2014/03/27 Javascript
js日期联动示例
2014/05/02 Javascript
javascript制作的网页侧边弹出框思路及实现代码
2014/05/21 Javascript
js实现DOM走马灯特效的方法
2015/01/21 Javascript
JavaScript自定义数组排序方法
2015/02/12 Javascript
JS+CSS实现淡入式焦点图片幻灯切换效果的方法
2015/02/26 Javascript
JavaScript控制table某列不显示的方法
2015/03/16 Javascript
javascript学习笔记之函数定义
2015/06/25 Javascript
浅谈jquery设置和获得checkbox选中的问题
2016/08/19 Javascript
巧用jQuery选择器提高写表单效率的方法
2016/08/19 Javascript
浅谈Node.js:理解stream
2016/12/08 Javascript
Bootstrap Search Suggest使用例子
2016/12/21 Javascript
jquery无法为动态生成的元素添加点击事件的解决方法(推荐)
2016/12/26 Javascript
zTree树形插件异步加载方法详解
2017/06/14 Javascript
基于Vue2x实现响应式自适应轮播组件插件VueSliderShow功能
2018/05/16 Javascript
javascript标准库(js的标准内置对象)总结
2018/05/26 Javascript
vue-router重定向不刷新问题的解决
2018/06/25 Javascript
jQuery实现表单动态添加数据并提交的方法
2018/07/19 jQuery
js取小数点后两位四种方法
2019/01/18 Javascript
VUE组件中的 Drawer 抽屉实现代码
2019/08/06 Javascript
vue组件开发之slider组件使用详解
2020/08/21 Javascript
Python测试网络连通性示例【基于ping】
2018/08/03 Python
如何使用Python多线程测试并发漏洞
2019/12/18 Python
解决Python paramiko 模块远程执行ssh 命令 nohup 不生效的问题
2020/07/14 Python
外语系毕业生找工作的求职信
2013/11/28 职场文书
医药销售求职信范文
2014/02/01 职场文书
党员大会主持词
2014/04/02 职场文书
高中生逃课检讨书
2014/10/10 职场文书
民政工作个人总结
2015/02/28 职场文书
如何才能写好调研报告?
2019/07/03 职场文书
iSCSI服务器CHAP双向认证配置
2022/04/01 Servers