forked from liudf0716/apfree-wifidog
-
Notifications
You must be signed in to change notification settings - Fork 0
/
login.html
154 lines (149 loc) · 6.5 KB
/
login.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
<!DOCTYPE html>
<html>
<head lang="en">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=no"/>
<meta http-equiv="X-UA-COMPATIBLE" content="IE=edge,chrome=1"/>
<!--[if lt IE 9]
<script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
<script src="https://oss.maxcdn.com/libs/respond.js/1.3.0/respond.min.js"></script>
<![endif]>-->
<!-- Place this tag in your head or just before your close body tag. -->
<script async defer src="https://buttons.github.io/buttons.js"></script>
<title></title>
</head>
<style>
body{
margin:0;
padding:0;
overflow: hidden;
background-color:#26bbc1;
}
.wrap{
width:100%;
height:100%;
background: -webkit-gradient(linear, left top, left bottom, from(#0367f9), to(#26bbc1));
background: -webkit-linear-gradient(#0367f9, #26bbc1);
background: linear-gradient(#0367f9, #26bbc1);
background-color:#0367f9;
position: absolute;
}
.cont{
/*width:74%;*/
width:320px;
margin:0 auto;
}
.logo{width:100px;height:100px;margin:80px auto 50px;border-radius:4px;/*background-color:rgba(255,255,255,0.1);*/}
.title{width:80px;height:80px;line-height: 80px;font-size:18px;font-weight:normal;display:inline-block;text-align:center;color:#fff;margin:10px;padding:0;/*background-color:rgba(255,255,255,0.1);border-radius: 40px;*/}
.item{width:100%;height:40px;border-radius:4px;margin:20px auto 0;outline: none;}
.btncont{width:100%;margin:0px auto;}
.btn{background-color:#0cc455;color:#fff;font-weight: bold;border:none;}
.btn:hover{background-color:#5ed18c;}
.inp{width:90%;padding:0 5%;height:40px;border:none;line-height:40px;color:#666;text-align: center;}
/*input-placeholder { /!* WebKit browsers *!/*/
/*color: #999;*/
/*}*/
.tipcont{width:74%;margin:0 auto;text-align: center;}
.url{color:#fff;display: inline-block;margin-top:30px;}
@media screen and (min-width: 360px) and (max-width: 988px){
.cont{width:320px;}
}
@media screen and (max-width: 359px) {
.cont{width:76%;}
.tipcont{width:100%;}
}
</style>
<body>
<div class="wrap">
<div class="cont">
<div class="logo">
<!--<img src="" alt=""/>-->
<h3 class="title">欢迎登录</h3>
</div>
<div class="inpcont">
<input type="password" class="inp item" id="pwd" placeholder="请输入密码"/>
</div>
<div class="btncont">
<button class="item btn" id="btn">登 录</button>
</div>
</div>
<div class="tipcont">
<div class="input-info">
<a class="url" target="_blank" href="https://github.com/liudf0716/apfree_wifidog">Power by ApFree WiFiDog</a>
<p class="adbyby-p" style="margin-top:30px;margin-bottom:10px;">
<!-- Place this tag where you want the button to render. -->
<a class="github-button" href="https://github.com/liudf0716/apfree_wifidog/subscription" data-icon="octicon-eye" data-size="large" data-show-count="true" aria-label="Watch liudf0716/apfree_wifidog on GitHub">Watch</a>
<!-- Place this tag where you want the button to render. -->
<a class="github-button" href="https://github.com/liudf0716/apfree_wifidog" data-icon="octicon-star" data-size="large" data-show-count="true" aria-label="Star liudf0716/apfree_wifidog on GitHub">Star</a>
<!-- Place this tag where you want the button to render. -->
<a class="github-button" href="https://github.com/liudf0716/apfree_wifidog/fork" data-icon="octicon-repo-forked" data-size="large" data-show-count="true" aria-label="Fork liudf0716/apfree_wifidog on GitHub">Fork</a>
</p>
</div>
</div>
</div>
<script>
/* 封装ajax函数
* @param {string}opt.type http连接的方式,包括POST和GET两种方式
* @param {string}opt.url 发送请求的url
* @param {boolean}opt.async 是否为异步请求,true为异步的,false为同步的
* @param {object}opt.data 发送的参数,格式为对象类型
* @param {function}opt.success ajax发送并接收成功调用的回调函数
*/
function ajax(opt) {
opt = opt || {};
opt.method = opt.method.toUpperCase() || 'POST';
opt.url = opt.url || '';
opt.async = opt.async || true;
opt.data = opt.data || null;
opt.success = opt.success || function () {};
var xmlHttp = null;
if (XMLHttpRequest) {
xmlHttp = new XMLHttpRequest();
}
else {
xmlHttp = new ActiveXObject('Microsoft.XMLHTTP');
}var params = [];
for (var key in opt.data){
params.push(key + '=' + opt.data[key]);
}
var postData = params.join('&');
if (opt.method.toUpperCase() === 'POST') {
xmlHttp.open(opt.method, opt.url, opt.async);
xmlHttp.setRequestHeader('Content-Type', 'application/json');
// xmlHttp.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded;charset=utf-8');
xmlHttp.send(postData);
}
else if (opt.method.toUpperCase() === 'GET') {
xmlHttp.open(opt.method, opt.url + '?' + postData, opt.async);
xmlHttp.send(null);
}
xmlHttp.onreadystatechange = function () {
if (xmlHttp.readyState == 4 && xmlHttp.status == 200) {
opt.success(xmlHttp.responseText);
}
};
}
window.onload = function(){
var btn = document.getElementById('btn');
btn.onclick = function(){
var pwd = document.getElementById('pwd').value;
if(pwd == ''){
alert('输入不能为空');
return false;
}
ajax({
method:'GET',
url:'',
data:{
// user:user,
// pwd:pwd
},
success: function(response){
console.log(response);
}
})
}
}
</script>
</body>
</html>