/*数字键盘start*/
.markBox {
background: #fff;
position: absolute;
left: 0;
right: 0;
bottom: 0;
height: 4.8rem;
}
.flexed {
border-top: 1px solid #e8e8e8;
width: 100%;
height: 100%;
overflow: hidden;
}
.flexed .spuared {
width: 75%;
float: left;
overflow: hidden;
}
.flexed .rightBtn {
width: 25%;
float: left;
}
.spuared li {
width: 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 {
width: 50%;
border-bottom: none;
}
.rightBtn .del {
width: 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>支 付</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‘); }
原文:https://www.cnblogs.com/xushengguan/p/10040029.html