zoukankan      html  css  js  c++  java
  • 数字键盘

    /*数字键盘start*/
    
            .markBox {
                background: #fff;
                position: absolute;
                left: 0;
                right: 0;
                bottom: 0;
                height: 4.8rem;
            }
    
            .flexed {
                border-top: 1px solid #e8e8e8;
                 100%;
                height: 100%;
                overflow: hidden;
            }
    
            .flexed .spuared {
                 75%;
                float: left;
                overflow: hidden;
            }
    
            .flexed .rightBtn {
                 25%;
                float: left;
            }
    
            .spuared li {
                 33.33%;
                height: 1.2rem;
                border-right: 1px solid #e8e8e8;
                border-bottom: 1px solid #e8e8e8;
                font-size: 0.6rem;
                color: #212121;
                text-align: center;
                line-height: 1.2rem;
                float: left;
            }
    
            .spuared li:active {
                background: #ecedef;
            }
    
            .spuared li.whf {
                 50%;
                border-bottom: none;
            }
    
            .rightBtn .del {
                 100%;
                height: 1.2rem;
                background: url(../../image/del.png) no-repeat center;
                background-size: 37px 27px;
                border-bottom: 1px solid #e8e8e8;
            }
    
            .rightBtn .confirm {
                padding: 10px;
                text-align: center;
                font-size: 15px;
                line-height: 20px;
                writing-mode: vertical-lr;
            }
    
            .confirm p {
                font-size: 0.44rem;
                line-height: 52px;
            }
            /*数字键盘end*/
    
    <div class="markBox">
            <div class="flexed">
                <ul class="spuared">
                    <li tapmode onclick="goScore(this)">1</li>
                    <li tapmode onclick="goScore(this)">2</li>
                    <li tapmode onclick="goScore(this)">3</li>
                    <li tapmode onclick="goScore(this)">4</li>
                    <li tapmode onclick="goScore(this)">5</li>
                    <li tapmode onclick="goScore(this)">6</li>
                    <li tapmode onclick="goScore(this)">7</li>
                    <li tapmode onclick="goScore(this)">8</li>
                    <li tapmode onclick="goScore(this)">9</li>
                    <li class="whf" tapmode onclick="goScore(this)">.</li>
                    <li class="whf" tapmode onclick="goScore(this)">0</li>
                </ul>
                <div class="rightBtn" id="wrap">
                    <div class="del" tapmode onclick="Del()"></div>
                    <div class="confirm flex-center" id="main" tapmode onclick="Pay()">
                        <p>&nbsp;&nbsp;&nbsp;</p>
                    </div>
                </div>
            </div>
        </div>
    function goScore(e) {
            var result = $api.val($api.dom('#result'));
            var num = $api.text(e);
            if (!result && num == '.') {
                // result = '';
                return false;
            } else {
                if ((result.split('.')).length - 1 > 0 && num.indexOf('.') > -1) {
                    return false;
                } else {
                    result += num;
                }
            }
            $api.val($api.dom('#result'), result);
    
        }
    
        // 清除
        function Del() {
            $api.val($api.dom('#result'), '');
            $api.css($api.dom('.txt'), 'display:none');
        }
  • 相关阅读:
    洛谷P2292 [HNOI2004]L语言
    洛谷P4052 [JSOI2007]文本生成器(AC自动机)
    洛谷P3193 [HNOI2008]GT考试(KMP,矩阵)
    创建目录命令
    ssh免密码登录机器(使用公钥和秘钥进行加密来实现)
    kafka工作原理介绍
    KafKa集群安装、配置
    Kafka的partions和replication-factor参数的理解
    linux之find命令详解
    将用户需求和新型技术输入,优质服务和价值体验输出。
  • 原文地址:https://www.cnblogs.com/xushengguan/p/10040029.html
Copyright © 2011-2022 走看看