不重新整理頁面的登入框(基於Thinkphp)
1、Htlm(loginPopUp.html):
<link type="text/css" rel="stylesheet" href="__PUBLIC__/Css/H/loginPopUp.css"/>
<script src="__PUBLIC__/Js/H/loginPopUp.js" type="text/javascript"></script>
<section hidden>
<div id='rvType'></div>
<div id='rvId'></div>
<div id='rvTo'></div>
<div id='rvPlid'></div>
<div id='rvCon'></div>
<div></div>
<div>
<div><a onClick="closeBox()">×</a></div>
<p>使用者登入</p>
<div>
<div>
<div>
<i></i><span id="msg-error-text"></span>
</div>
</div>
<div class="item item-name">
<input type="text" id="loginName" name="name" placeholder="手機號"/>
</div>
<div class="item item-password">
<input type="password" id="loginPass" name="password" placeholder="密碼" />
</div>
<div>
<input type="submit" class="btn-img btn-entry" id="loginsubmit"
onClick="return subLogin(this);" value="立即登入" />
<input type="reset" style="display:none;" />
</div>
</div>
</div>
</section>
2、CSS(loginPopUp.css):
.login-form{
position:fixed;
width:306px;
height:260px;
margin:auto;top:0;left:0;right:0;bottom:0;
background:#FFF;
z-index:900001;
padding: 20px 50px;
}
.login-form .login-form-title{
text-align:center;
letter-spacing: 0.5em;
font-size:1.2em;
}
.login-form .msg-wrap{
min-height: 31px;
height: auto;
margin: 5px 0;
visibility: hidden;
color:#ef4744;
}
.login-form .item{
overflow:hidden;
height:38px;
position:relative;
border: 1px solid #ddd;
margin-bottom:20px;
}
.login-form .item .iconfont{
display:block;
width:20px;
height:20px;
position:absolute;
left:10px;
top:9px;
}
.login-form .item .text{
line-height: 18px;
height: 38px;
border: 0;
padding: 10px 0 10px 10px;
width: 294px;
float: none;
overflow: hidden;
font-size: 14px;
}
.login-form .login-btn{
margin-bottom:20px;
overflow:hidden;
}
.login-form .login-btn .btn-img{
width: 300px;
height: 35px;
font-size: 14px;
color: #FFF;
background: #78C4EC;
text-align: center;
line-height: 35px;
text-decoration: none;
cursor: pointer;
letter-spacing: 2px;
border: none;
-moz-box-shadow: 1px 1px 2px #78c4ec; /* Firefox */
-webkit-box-shadow: 1px 1px 2px #78c4ec; /* Safari 和 Chrome */
box-shadow: 1px 1px 2px #78c4ec;
}
.login-form-top{
text-align:right;
margin-top:-20px;
}
.login-form-top a{
padding:0px 6px;
text-align:center;
margin-right:-50px;
font-size:22px;
font-weight:600;
color:#666;
}
.login-form-top a:hover{
background:#78c4ec;
}
3、jquery(loginPopUp.js):
function subLogin(_obj){
var parent=$(_obj).parent().parent();
var name=$(parent).children('.item').children('#loginName').val();
var pass=$(parent).children('.item').children('#loginPass').val();
$.ajax({
type: "GET",
async:false,
url: genlujing+'/Home/Login/checkAll',
data: "name="+name+"&pass="+pass,
success: function(data){
status=data;
}
});
while(status.indexOf('"')>=0){
status=status.replace('"',''); // "2"=》2
}
if(status>0){
$(parent).children('.msg-wrap').children('.msg-error').children('#msg-error-text').text('');
$('.login-form .msg-wrap').css('visibility','hidden');
//記錄登入
$.ajax({
type: "GET",
async:false,
url: genlujing+'/Home/Login/login',
data: "id="+status,
success: function(data){
status2=data;
}
});
if(status2==1){
$('.login_layer').attr('hidden',true);
}else{
$(parent).children('.msg-wrap').children('.msg-error').children('#msg-error-text').text('登入失敗');
$('.login-form .msg-wrap').css('visibility','visible');
}
}else{
$(parent).children('.msg-wrap').children('.msg-error').children('#msg-error-text').text('賬號密碼錯誤或者賬號異常');
$('.login-form .msg-wrap').css('visibility','visible');
return false;
}
}
function closeBox(){
$('.login_layer').attr('hidden',true);
}
4、php(LoginController.class.php):
/*不跳轉登入/單頁彈框S*/
public function checkAll(){
$name=trim($_GET['name']);
$pass=trim($_GET['pass']);
if($name != '' && $pass != ''){
$re=$this->user->where("(mobile_phone='".$name."' OR email='".$name."') AND password='".md5($pass)."' AND user_status=1")->find();
if($re){
$this->ajaxReturn($re['id']);
//echo json_encode($re['id']);
}else{
$this->ajaxReturn();
}
}else{
$this->ajaxReturn();
}
}
public function login(){
$id=str_replace('"','',$_GET['id']);
$findRe=$this->user->where(array('id'=>$id))->find();
if($findRe['user_status']==0){//未註冊完成
$_SESSION['HLid']=$id;
$_SESSION['HRegid']=$findRe['id'];
$this->redirect('Home/Register/regInfo');
}elseif($findRe['user_status']==1){//正常
$_SESSION['HLid']=$id;
$this->ajaxReturn(1);
}elseif(($findRe['user_status']==3) || ($findRe['user_status']==4)){//暫停
$this->error('抱歉,您的賬號暫停','./');
}
}
/*不跳轉登入/單頁彈框E*/