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');
        }
  • 相关阅读:
    SharePoint 2013 APP 开发示例 (六)服务端跨域访问 Web Service (REST API)
    麦咖啡导致电脑不能上网
    SharePoint 2013 Central Admin 不能打开
    SharePoint 2013 APP 开发示例 (五)跨域访问 Web Service (REST API)
    SharePoint 2013 APP 开发示例 系列
    synthesize(合成) keyword in IOS
    Git Cmd
    简单的正则匹配
    Dropbox
    SQL Server Replication
  • 原文地址:https://www.cnblogs.com/xushengguan/p/10040029.html
Copyright © 2011-2022 走看看