zoukankan      html  css  js  c++  java
  • 第二百一十七节,jQuery EasyUI,NumberSpinner(数字微调)组件

    jQuery EasyUI,NumberSpinner(数字微调)组件

     

    学习要点:

      1.加载方式

      2.属性列表

      3.事件列表

      4.方法列表

    本节课重点了解 EasyUI 中 NumberSpinner(数字微调)组件的使用方法,这个组件依赖于 Numberbox(数值输入框)和 Spinner(微调)组件。

    一.加载方式

    class 加载方式

    <input id="box" class="easyui-numberspinner">

    numberspinner()将一个输入框执行数字微调组件方法

    JS 加载调用

    $(function () {
        $('#box').numberspinner({
            value: 10,
            increment: 10,
            min: 10,
            max: 500,
        });
    });

    二.属性列表

    注意:数字微调组件,属性,方法,事件继承微调组件的属性,和验证框组件的属性,关于验证方面的参照验证框属性,关于微调的参照微调属性

    $(function () {
        $('#box').numberspinner({
            required: true,     //继承验证框组件的,不能为空
             200,         //继承微调组件的,宽度
            height: 30,         //继承微调组件的,高度
            value: 2,           //继承微调组件的,设置值
            min: 1,             //继承微调组件的,最小值
            max: 500,           //继承微调组件的,最大值
            increment: 1,       //继承微调组件的,增量
            spin: function (down) {     //继承微调组件的,点击微调按钮事件
                alert(down);
            },
        });
    });

    三.事件列表

    NumberSpinner(数字微调)组件继承自 Spinner(微调)组件。

    $(function () {
        $('#box').numberspinner({
            required: true,     //继承验证框组件的,不能为空
             200,         //继承微调组件的,宽度
            height: 30,         //继承微调组件的,高度
            value: 2,           //继承微调组件的,设置值
            min: 1,             //继承微调组件的,最小值
            max: 500,           //继承微调组件的,最大值
            increment: 1,       //继承微调组件的,增量
            onSpinUp: function () {
                alert('点击了上微调按钮');
            },
            onSpinDown: function () {
                alert('点击了下微调按钮');
            },
        });
    });

    四.方法列表

    NumberSpinner(数字微调)组件继承自 Spinner(微调)组件方法

    如:取值赋值

    $(function () {
        $('#box').numberspinner({
            required: true,     //继承验证框组件的,不能为空
             200,         //继承微调组件的,宽度
            height: 30,         //继承微调组件的,高度
            value: 2,           //继承微调组件的,设置值
            min: 1,             //继承微调组件的,最小值
            max: 500,           //继承微调组件的,最大值
            increment: 1,       //继承微调组件的,增量
        });
        $('#box').numberspinner('setValue', 100);
        alert($('#box').numberspinner('getValue'));
    });

    我们可以使用$.fn.numberspinner.defaults 重写默认值对象。

  • 相关阅读:
    树莓派pwm驱动好盈电调及伺服电机
    wiringPi库的pwm配置及使用说明
    未能加载文件或程序集“**, Version=1.0.0.0, Culture=neutral, PublicKeyToken=null”或它的某一个依赖项。试图加载格式不正确的程序。
    poj 1700 Crossing River(贪心)
    前缀 树 背单词(Remember the Word,LA 3942)
    c/c++ double的数字 转成字符串后 可以有效的避免精度要求不高的数
    hdu acm 2154(多解取一解)
    hdu 5104 Primes Problem(prime 将三重循环化两重)
    hdu 2203亲和串 (kmp)
    hdu 2519 新生晚会 排列组合
  • 原文地址:https://www.cnblogs.com/adc8868/p/6673169.html
Copyright © 2011-2022 走看看