基于jQuery原型封装数值录入框，禁止录入、粘贴非数值字符

(function ($) {

    // 数值输入框

    $.fn.numbox = function (options) {

        var type = (typeof options);

        if (type == 'object') {

            if (options.width) this.width(options.width);

            if (options.height) this.height(options.height);

            this.bind("input propertychange", function (obj) {

                numbox_propertychange(obj.target);

            });

            this.bind("change", function (obj) {

                var onChange = options.onChange;

                if (!onChange) return;

                var numValue = Number(obj.target.value);

                onChange(numValue);

            });

            this.bind("hide", function (obj) {

                var onHide = options.onHide;

                if (!onHide) return;

                var numValue = Number(obj.target.value);

                onHide(numValue);

            });

            return this;

        }

        else if (type == 'string') {
　　　　　　　// type为字符串类型，代表调用numbox对象中定义的方法

            var method = eval(options);

            if (method) return method(this, arguments);

        }

    }

    // 属性值变化事件

    function numbox_propertychange(numbox) {

        if (numbox.value == '-' || numbox.value == numbox.oldvalue) return;

        var numvalue = Number(numbox.value);

        if (isNaN(numvalue)) {

            numbox.value = numbox.oldvalue;

        }

        else {

            numbox.oldvalue = numbox.value;

        }

    }

    // 获取值

    function getValue(numbox) {

        var value = numbox.val();

        return Number(value);

    }

    // 设置值

    function setValue(numbox, params) {

        if (params[1] == undefined) return;

        var numvalue = Number(params[1]);

        if (!isNaN(numvalue)) {

            for (var i = 0; i < numbox.length; i++) {

                numbox[i].focus();

                numbox[i].value = numvalue;

                numbox[i].oldvalue = numvalue;

            }

        }

    }

})(jQuery);

调用方法如下

<body>

    <input id="test" />

    <script>

        $("#test").numbox({

            width: 150,

            height: 20

        });

        // 调用setValue方法设置值
        $("#test").numbox('setValue',100);
</script> 
</body>

jQuery插件封装系列（一）—— 金额录入框的更多相关文章

  1. 我的第一个jquery插件：下拉多选框

    <!DOCTYPE HTML> <html> <head> <title> New Document </title> <meta n ...

  2. jquery插件封装

    HTML <!DOCTYPE html> <html> <head> <title></title> <style> .page ...

  3. 最简单的原生js和jquery插件封装

    最近在开发过程中用别人的插件有问题,所以研究了一下,怎么封装自己的插件. 如果是制作jquery插件的话.就将下面的extend方法换成  $.extend 方法,其他都一样. 总结一下实现原理: 将 ...

  4. 【jQuery】jquery插件封装

    扩展jQuery插件开发的基本知识,最佳做法和常见的陷阱. 入门 编写一个jQuery插件开始于给jQuery.fn加入​​新的功能属性,此处添加的对象属性的名称就是你插件的名称: jQuery.fn ...

  5. jQuary总结11:jQuery插件封装---jQuery封装 手风琴 动画插件

    完整代码下载点击我的GitHub: https://github.com/XingJYGo/jquery-accordion 1 手风琴的效果展示如下: 2 封装插件目录结构如下: 主要包括:HTML ...

  6. jquery插件封装成seajs模块

    jquery直接在html中引入. jquery插件修改为: define(function (require, exports, moudles) { return function (jquery ...

  7. jquery插件封装思路整理

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  8. (jQuery 插件)封装容器的表单为json对象

    下面代码可以把一个页面容器中的表单元素封装成一个json对象. (function($){ $.fn.serializeObject=function(){ var inputs=$(this).fi ...

  9. jQuery 插件封装的方法

    方式1.$.fn.xxx ==>针对元素添加方法: ;(function ($) { $.fn.m​​yPlugin = function () { //你自己的插件代码 }; })(jQuer ...

随机推荐

  1. Robot Framework（十） 执行测试用例——测试执行

    3.2测试执行 本节描述如何执行从解析的测试数据创建的测试套件结构,如何在失败后继续执行测试用例,以及如何正常停止整个测试执行. 3.2.1执行流程 执行套房和测试 设置和拆卸 执行顺序 3.2.2继 ...

  2. faster rcnn需要理解的地方

    http://blog.csdn.net/terrenceyuu/article/details/76228317 https://www.cnblogs.com/houkai/p/6824455.h ...

  3. CS193p Lecture 5 - View Controller Lifecycle

    1. UITextView @property(nonatomic,readonly,retain) NSTextStorage *textStorage 是 NSMutableAttributedS ...

  4. sessionStorage 的数据会在同一网站的多个标签页之间共享吗？这取决于标签页如何打开

    一直以来,我所以为的 sessionStorage 的生命周期是这样的:在 sessionStorage 中存储的数据会在当前浏览器的同一网站的多个标签页中共享,并在此网站的最后一个标签页被关闭后清除 ...

  5. vue-cli3.0 生产包去除console.log

    目前负责的公众号又迭代了一个版本,之前打生产包,配置总是和测试包搞混,所以使用了vue-cli3.0的环境变量来控制配置. 但是又发现了一个新问题,写代码的过程中写了很多console.log 来调试 ...

  6. 文件读写FILE类

    1. 新建一个文件: FILE *f = fopen("a.txt","w+"); (1)fopen()函数介绍fopen的原型是:FILE *fopen(co ...

  7. MySql中引擎

    1. InnoDB 引擎 MySQL 5.5 及以后版本中的默认存储引擎,它的优点如下:灾难恢复性好,支持事务,使用行级锁,支持外键关联,支持热备份. InnoDB引擎中的表,其数据的物理组织形式是簇 ...

  8. [LUOGU] P2245 星际导航

    题目描述 sideman做好了回到Gliese 星球的硬件准备,但是sideman的导航系统还没有完全设计好.为了方便起见,我们可以认为宇宙是一张有N 个顶点和M 条边的带权无向图,顶点表示各个星系, ...

  9. [图文] Fedora 28 使用 Virt-Manager 制作并优化QCOW2镜像——Windows 10 1709

    实验说明: 云计算的发展使得桌面上云,windows 10就必不可少,这一章就如何制作QCOW2镜像文件并优化进行说明. 实验环境: 宿主机系统   :Fedora 28 WorkStation 虚拟 ...

  10. uboot-imx RGB24分析

    在mx6q_sabrsd.c文件中 函数else if(strcmp(s, "YUV444") == 0) val = IPU_PIX_FMT_YUV444; else val = ...