AJAX請求
<html>
<head>
<meta charset="utf-8">
<title>登錄</title>
<script src="http://cdn.static.runoob.com/libs/jquery/1.10.2/jquery.min.js"></script>
<script>
$(function(){
$('#btn').click(function(e){
e.preventDefault();
$.ajax({
cache: true,
type: "POST",
url:"http://110.64.72.20:3000/",
data:$('#user_form').serialize(),
async: true,
error: function(res) {
//console.log(res)
document.getElementById("Prompt").style.display="block";
document.getElementById("alertP2").innerHTML="無法連接到服務器！";
},
success: function(res) {
// console.log('???sdsdds')
// console.log(res)
if(res.code == '0')
{
window.location.href = "http://110.64.72.20:3000/";
// alter('000000')
}
else
{
document.getElementById("Prompt").style.display="block";
document.getElementById("alertP2").innerHTML="賬號或密碼錯誤！";
}
}
});
});
$('#alertY2').click(function(e){
document.getElementById("Prompt").style.display="none";
});
$('#alertZ').click(function(e){
document.getElementById("Prompt").style.display="none";
});
});
</script>
<link rel="stylesheet" type="text/css" href="/stylesheets/style.css" charset="utf-8"></link>
<link rel="stylesheet" type="text/css" href="/stylesheets/Prompt_style.css" charset="utf-8"></link>
<style type="text/css">
.login{
background-color:blue;
}
.login:hover{
background-color:darkblue;
}
.account,.password,.hint,.login{
font-family: 'MySecondWebFontName';
}
</style>
</head>
<body>
<div id="Prompt" style="display:none">
<div id="hbg"></div> <!-- 半透明背景遮罩 -->
<div id="alertM"> <!-- 提示框的容器 -->
<h5 id="alertT">提示</h5> <!-- 標題 -->
<div id="alertR">
<a id="alertY2" title="關閉" >×</a>
</div> <!-- 關閉按鈕 -->
<div><p id="alertP2"></p></div> <!-- 內容 -->
<div id="alertBtns"> <!-- 按鈕區域 -->
<a id="alertZ" title="確認" >確認</a> <!-- 確認和取消按鈕 -->
</div>
</div>
</div>
<div style="position:absolute;left:0px;top:0px;width:1349px;min-height:668px;background-image:url(/images/背景.jpg);background-repeat:no-repeat;background-attachment:fixed">
<div style="background:#FFFAFA;background-color:rgba(255,255,255,0.6);border:1px solid #000;position:absolute;width:400px;height:300px;top:50%;left:50%;margin-left:-200px;margin-top:-150px;text-align:center">
<h1 class="title" style="padding-top:10px;text-shadow:5px 5px 5px darkgrey">小型企業進銷存管理</h1>
<form autocomplete="on" id="user_form">
<p class="account" style="padding-top:0px;font-size:25px">賬號: <input type="text" name="Eaccount" id="Eaccount" ></p>
<p class="password" style="padding-top:5px;font-size:25px">密碼: <input type="password" name="Epassword" id="Epassword" ></p>
<p class="hint" style="padding-top:0px;font-size:15px;font-weight:bold;text-shadow:5px 5px 5px grey"> * 登錄賬號爲工號；默認登錄密碼爲123456！</p>
</form>
<input style="cursor:pointer;width:100px;height:40px;margin-top:10px;text-decoration:none;color:white;font-size:20px" class="login" id="btn" type="submit" value="登錄"/>
</div>
</div>
</body>
</html>