parent
b6a06be8bd
commit
947d745a24
After Width: | Height: | Size: 2.9 KiB |
@ -0,0 +1,118 @@
|
||||
<!doctype html>
|
||||
<html>
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1,user-scalable=no">
|
||||
<meta name="apple-mobile-web-app-capable" content="yes">
|
||||
<meta name="apple-mobile-web-app-status-bar-style" content="black">
|
||||
<meta content="telephone=no" name="format-detection" />
|
||||
|
||||
<link href="style.css" tppabs="http://www.17sucai.com/preview/1089623/2018-06-08/form/css/style.css" rel="stylesheet" type="text/css">
|
||||
|
||||
|
||||
<title>注册判断</title>
|
||||
|
||||
<script>
|
||||
(function (doc, win) {
|
||||
var docEl = doc.documentElement,
|
||||
resizeEvt = 'orientationchange' in window ? 'orientationchange' : 'resize',
|
||||
recalc = function () {
|
||||
var clientWidth = docEl.clientWidth;
|
||||
if (!clientWidth) return;
|
||||
if(clientWidth>=750){
|
||||
docEl.style.fontSize = '100px';
|
||||
}else{
|
||||
docEl.style.fontSize = 100 * (clientWidth / 750) + 'px';
|
||||
}
|
||||
};
|
||||
|
||||
if (!doc.addEventListener) return;
|
||||
win.addEventListener(resizeEvt, recalc, false);
|
||||
doc.addEventListener('DOMContentLoaded', recalc, false);
|
||||
})(document, window);
|
||||
</script>
|
||||
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div id="Nav_bar">
|
||||
<div class="left"><a href="#" onclick="history.go(-1)"><img src="left_arrow.png" ></a></div>
|
||||
<div class="center">卡号绑定</div>
|
||||
<div class="right"><img src="dian.png"></div>
|
||||
</div>
|
||||
<!--中间内容部分-->
|
||||
<div id="content">
|
||||
<div class="txt01">银行卡号<input type="number" id="mobile" name="mobile" class="text" value="" pattern="[0-9]*" tabindex="10" onChange="check_for_btn()" /></div>
|
||||
<div class="txt01">真实姓名<input type="text" id="realname" name="realname" class="text" tabindex="7" onChange="check_for_btn()" /></div>
|
||||
<div class="txt01">身份证号
|
||||
<input type="text" id="realname" pattern="[0-9]*" name="realname" class="text" tabindex="6"/>
|
||||
</div>
|
||||
<div class="txt01">预留手机号<input type="number" id="realname" pattern="[0-9]*" name="realname" class="text1" tabindex="6"/></div>
|
||||
</div>
|
||||
<button id="btn" class="r_but" onClick="check()">确定</button>
|
||||
|
||||
<script type="text/javascript" src="jquery-1.8.3.min.js" tppabs="http://www.17sucai.com/preview/1089623/2018-06-08/form/js/jquery-1.8.3.min.js"></script>
|
||||
|
||||
<script type="text/javascript">
|
||||
//弹出框
|
||||
function alert1(e) {
|
||||
$("body").append("<div id='msg'><span>" + e + "</span></div>");
|
||||
clearmsg();
|
||||
}
|
||||
|
||||
//关闭弹出框
|
||||
function clearmsg() {
|
||||
var t = setTimeout(function() {
|
||||
$("#msg").remove();
|
||||
}, 2000)
|
||||
};
|
||||
|
||||
//提交后的check
|
||||
function check() {
|
||||
|
||||
var mobile = $("#mobile").val();
|
||||
var realname = $("#realname").val();
|
||||
|
||||
if(mobile == "") {
|
||||
alert1("请输入手机号");
|
||||
clearmsg();
|
||||
return false;
|
||||
}
|
||||
if(!(/^1[34578]\d{9}$/.test(mobile))) {
|
||||
alert1("请输入正确的手机号");
|
||||
clearmsg();
|
||||
return false;
|
||||
}
|
||||
if(realname == "") {
|
||||
alert1("请输入姓名");
|
||||
clearmsg();
|
||||
return false;
|
||||
}
|
||||
|
||||
$(".r_but").css("background", "#49b9eb");
|
||||
|
||||
}
|
||||
|
||||
//必填项没有全部填写时,灰色,全部填写时蓝色
|
||||
function check_for_btn() {
|
||||
var mobile = $("#mobile").val();
|
||||
var realname = $("#realname").val();
|
||||
if(realname == "" || mobile == null) {
|
||||
$(".r_but").css("background", "#d1d5db");
|
||||
}
|
||||
if(realname != "" && mobile != null) {
|
||||
$(".r_but").css("background", "#49b9eb");
|
||||
}
|
||||
|
||||
}
|
||||
$(function() {
|
||||
|
||||
$(".r_but").css("background", "#d1d5db");
|
||||
|
||||
|
||||
})
|
||||
</script>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
|
File diff suppressed because one or more lines are too long
After Width: | Height: | Size: 3.0 KiB |
@ -0,0 +1,53 @@
|
||||
html, body, ul, li, ol, dl, dd, dt, p, h1, h2, h3, h4, h5, h6, form, fieldset, legend, img{
|
||||
margin:0;
|
||||
padding:0;
|
||||
}
|
||||
body {
|
||||
font-family: 'microsoft yahei','微软雅黑','abchanel-couture','华文细黑','STXHei','华文黑体','ST Heiti','MS黑体','MSHei','Arial','Helvetica','sans-serif';
|
||||
background-color: #fff;
|
||||
height: 100%;
|
||||
max-width:7.5rem;
|
||||
margin: 0 auto;
|
||||
}
|
||||
li, ul {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
border: none;
|
||||
}
|
||||
li, ul { list-style-type: none;}
|
||||
img {
|
||||
border: 0;
|
||||
border: none;
|
||||
width: 100%;
|
||||
}
|
||||
a, a:hover, a:visited {text-decoration: none;}
|
||||
a{color: #000;}
|
||||
a:hover, a:focus{
|
||||
color: #333;
|
||||
}
|
||||
#Nav_bar{height:0.88rem; padding:0 0.2rem; background:#2d2d2e; color:#fff; font-size:0.28rem;}
|
||||
#Nav_bar .left{width:20%; height:0.63rem; float:left; padding-top:0.25rem;}
|
||||
#Nav_bar .left img{ width:0.2rem; height:0.38rem;}
|
||||
#Nav_bar .center{width:60%; height:0.88rem; float:left; font-size:0.36rem; text-align:center; line-height:0.88rem;}
|
||||
#Nav_bar .right{width:20%; height:0.88rem; float:right; text-align:right; line-height:0.88rem;}
|
||||
#Nav_bar .right img{ width:0.5rem; height:0.1rem;}
|
||||
|
||||
#content{width:6.9rem; overflow:auto; padding:0 0.3rem;}
|
||||
#content .txt01{width:100%; min-height:1.08rem; border-bottom:#dfdfdf solid 0.01rem; float:left; line-height:1.08rem; color:#666; font-size:0.3rem;}
|
||||
.r_but{ width:5.5rem; height:0.98rem; background:#49b9eb; line-height:0.98rem; border:none; font-size:0.32rem; color:#fff; text-align:center; margin-left:1rem;}
|
||||
select,input,textarea{
|
||||
font-size: 0.28rem;
|
||||
color: #999;
|
||||
width: 70%;
|
||||
height: 1rem;
|
||||
float: right;
|
||||
margin-right: 0.1rem;
|
||||
border: none;
|
||||
}
|
||||
.txt01 label{float:right; width:13%; height:0.48rem; text-align:right; margin-top:0.3rem; vertical-align:middle; line-height:0.48rem; margin-left:0.8rem;}
|
||||
.txt01 span{ margin-bottom:-0.1rem;}
|
||||
.txt01 a{float:right; height:1rem; width:80%; text-align:right; color:#999;}
|
||||
/*弹出框样式*/
|
||||
#msg {height: 1em; text-align: center; position: fixed; top: 50%; margin-top: -1rem; line-height: 2rem; width: 100%; }
|
||||
#msg span {color: #ffffff; background: rgba(0, 0, 0, 0.5); height: 1.5em; padding: 0.5em 1.5em; border-radius: 6px; font-size: 26px; font-family: "microsoft yahei"; }
|
||||
#btn {border-radius: 6px;}
|
Loading…
Reference in new issue