• Ext.form.field.Spinner微调字段


    1、Ext.form.field.Spinner主要配置

    配置项类型说明
    keyNavEnabled Boolean 设置是否启用对键盘向上和向下按钮的支持,默认为true
    mouseWheelEnabled Boolean 设置是否启用对鼠标滚动轮的支持,默认为true
    repeatTriggerClick Boolean 设置是否添加一个click repeater到微调按钮上,默认为true
    spinDownEnabled Boolean 向下按钮是否可用,默认为true
    spinUpEnabled Boolean 向上按钮是否可用,默认为true

    代码:

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head runat="server">
        <title>Ext.form.field.Spinner示例</title>
        <link href="ext-4.0.7-gpl/resources/css/ext-all.css" rel="stylesheet" type="text/css" />
        <script src="ext-4.0.7-gpl/bootstrap.js" type="text/javascript"></script>
        <script type="text/javascript">
            Ext.onReady(function () {
                var frm = new Ext.form.Panel({
                    title: "Ext.form.field.Spinner示例",
                    bodyStyle: "padding:5",
                    frame: true,
                    height: 100,
                     240,
                    renderTo: Ext.getBody(),
                    defaults: {
                        labelSeparator: "",
                        labelWidth: 80,
                         230,
                        labelAlign: "left"
                    },
                    items: [{
                        xtype: "spinnerfield",
                        fieldLabel: "微调字段",
                        id: "salary",
                        value: 100, // 初始化字段值
                        onSpinUp: function () {
                            var salary = Ext.getCmp("salary");
                            salary.setValue(Number(salary.getValue()) + 1);
                        },
                        onSpinDown: function () {
                            var salary = Ext.getCmp("salary");
                            salary.setValue(Number(salary.getValue()) - 1);
                        }
                    }]
                });
            });
        </script>
    </head>
    <body>
    </body>
    </html>

    效果图:

  • 相关阅读:
    some ideas
    zz 牛人啊
    zz 史上最全--各银行借记卡的年费、小额管理费、转账费等!
    哪裡可以買郵票
    : 求靠谱灭蟑螂的方法
    zz 【见闻八卦】《金融时报》年度商业书单:互联网题材占一半
    IOS开发基础知识--碎片6
    IOS开发基础知识--碎片5
    IOS开发基础知识--碎片4
    IOS中关于KVC与KVO知识点
  • 原文地址:https://www.cnblogs.com/libingql/p/2464559.html
Copyright © 2020-2023  润新知