<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

<html>

  <head>

    <title>NumberSpinner（数字微调）</title>

    <meta http-equiv="content-type" content="text/html; charset=UTF-8">

      <link rel="stylesheet" href="../themes/default/easyui.css" type="text/css"></link>

    <link rel="stylesheet" href="../themes/icon.css" type="text/css"></link>

    <script type="text/javascript" src="../js/jquery.min.js"></script>

    <script type="text/javascript" src="../js/jquery.easyui.min.js"></script>

    <script type="text/javascript" src="../js/easyui-lang-zh_CN.js"></script>

  </head>

  <body>

    商品数量:

    <input id="ss" style="width:80px;">

    <script type="text/javascript">

        $("#ss").numberspinner({

            min : 1,

            max : 100,

            value : 1

        });

    </script>

    <p/>

    你一共购买了<span id="num">1</span>个商品

    <script type="text/javascript">

        $("#ss").numberspinner({

            onSpinUp : function(){

                //获取数字微调的当前值

                var value = $("#ss").numberspinner("getValue");

                //将当前值设置到span标签中

                $("#num").text(value).css("color","red");

            },

            onSpinDown : function(){

                //获取数字微调的当前值

                var value = $("#ss").numberspinner("getValue");

                //将当前值设置到span标签中

                $("#num").text(value).css("color","red");

            }

        });

    </script>

    <script type="text/javascript">

        $("#ss").keyup(function(xxx){

            //将浏览器产生的事件对象设置到myevent变量中

            var myevent = xxx;

            //获取按键的unicode编码

            var code = myevent.keyCode;

            //如果按钮是回车

            if(code == 13){

                //获取数字微调的当前值，因为$(this)此时表示的是文本框，直接获取value属性值即可

                var value = $(this).val();

                //将当前值设置到span标签中

                $("#num").text(value).css("color","red");

            }

        });

    </script>

  </body>

</html>

easyUI之numberspinner数字微调框的更多相关文章

  1. 第二百一十七节，jQuery EasyUI，NumberSpinner(数字微调)组件

    jQuery EasyUI,NumberSpinner(数字微调)组件 学习要点: 1.加载方式 2.属性列表 3.事件列表 4.方法列表 本节课重点了解 EasyUI 中 NumberSpinner ...

  2. NumberSpinner( 数字微调) 组件

    本节课重点了解 EasyUI 中 Spinner(微调)组件的使用方法,这个组件依赖于Numberbox(数值输入框)和 Spinner(微调)组件. 一． 加载方式//class 加载方式<i ...

  3. 表单（下）-EasyUI Spinner 微调器、EasyUI Numberspinner 数值微调器、EasyUI Timespinner 时间微调器、EasyUI Slider 滑块

    EasyUI Spinner 微调器 扩展自 $.fn.validatebox.defaults.通过 $.fn.spinner.defaults 重写默认的 defaults. 微调器(spinne ...

  4. easyui源码翻译1.32--NumberSpinner（数字微调）

    前言 扩展自$.fn.spinner.defaults和$.fn.numberbox.defaults.使用$.fn.numberspinner.defaults重写默认值对象.下载该插件翻译源码 数 ...

  5. 【PyQt5-Qt Designer】QDoubleSpinBox-小数微调框

    QDoubleSpinBox-小数微调框 总体说明 大部分的总体说明和QSpinBox的差不多(详见:<PyQt5:微调框1>),这里主要把有差别的地方谈一下(三点). QDoubleSp ...

  6. 第二百一十八节，jQuery EasyUI，TimeSpinner(时间微调)组件

    jQuery EasyUI,TimeSpinner(时间微调)组件 学习要点: 1.加载方式 2.属性列表 3.事件列表 4.方法列表 本节课重点了解 EasyUI 中 TimeSpinner(时间微 ...

  7. easyui的combobox下拉框初始化默认值以及保持该值一直显示的方法

    easyui的combobox下拉框默认初始值是空,下面是实现从远程加载数据之后初始化默认值,以及让该值一直排在下拉框的最顶部的方式. 目前的需求是需要在初始化的时候添加"全部数据库&quo ...

  8. C# 全选中数字文本框内容

    /// <summary>        /// 全选中数字文本框内容        /// </summary>        /// <param name=&quo ...

  9. 关于QT Graphics View开启OpenGL渲染后复选框、微调框等无法正常显示的问题

    之前学习QT Graphics View框架,除了基本的图元外,还可以通过QGraphicsProxyWidget类添加QT的基本Widget(如按钮.复选框.单选框等),常使用的场景类接口如下: Q ...

随机推荐

  1. 文件 file open函数的打开及 函数的调用

    文件 mode 模式字符的含义 字符 含义 'r' 以只读方式打开(默认) 'w' 以只写方式打开,删除原有文件内容(如果文件不存在,则创建该文件并以只写方式打开) 'x' 创建一个新文件, 并以写模 ...

  2. 2-1 bash基本特性

    bash基本特性 bash基本介绍 bash是shell的一种,shell是计算机与用户交互的主要接口,狭义上的shell指的是CLI(command line interface命令行接口),用户输 ...

  3. 如何正确清理C盘？

    Windows电脑操作系统一般是安装在磁盘驱动器的C盘中,一旦运行,便会产生许多垃圾文件,C盘空间在一定程度上都会越来越小.伴随着电脑工作的时间越久,C盘常常会提示显示其内存已不足.那么C盘容量不足对 ...

  4. linux常用的操作命令

    ---恢复内容开始--- 最近换了工作之后,需要管理linux服务器的日常运行和维护,自然linux命令是少不了的,切换目录,vim操作等的简单的操作就不说了,有些时候还需要查看日志和监控服务器启动进 ...

  5. libusb_bulk_transfer 异步同步

    同步方式 libusb_bulk_transfer(devh, ep_bulk, buf, CAM_BUF_SZ, &len, timeout); 进入libusb研究,发现libusb是采用 ...

  6. Linux权限操作（用户和组）

    useradd 添加用户useradd -u uid user 创建指定uid的用户-o 配合-u 不检查uid的唯一性-d 指定家目录-s 指定shell-r 创建系统用户-m 强制创建家目录-M ...

  7. UVa1048 Low Cost Air Travel——最短路

    很好的一道题呀 思路 状态\(d(i,j)\)表示已经经过了行程单中的\(i\)个城市,目前在城市\(j\)的最小代价,直接建边跑最短路就行了 比如机票为\(ACBD\),行程单为\(CD\),那么对 ...

  8. 前端知识体系：JavaScript基础-原型和原型链-理解原型设计模式以及 JavaScript中的原型规则

    理解原型设计模式以及 JavaScript中的原型规则(原文地址) 1.原型对象:我们创建的每一个函数(JavaScript中函数也是一个对象)都有一个原型属性 prototype,原型属性实质上是一 ...

  9. Java中的集合Collections工具类(六)

    操作集合的工具类Collections Java提供了一个操作Set.List和Map等集合的工具类:Collections,该工具类里提供了大量方法对集合元素进行排序.查询和修改等操作,还提供了将集 ...

  10. 最小安装的centos7下安装oracle 12c

    下载 oracal 安装包 进入https://www.oracle.com/index.html  依次选择-->Menu -->Downloads and trials -->D ...