增加功能:使用自定义图标显示记住我checkbox,消除不同浏览器对复选框不能居中问题
This commit is contained in:
parent
80c93b1f35
commit
3ffb84a67c
|
@ -62,10 +62,10 @@
|
|||
<input type="password" name="password" class="form-control" value="" placeholder="密码" data-required-msg="请输入密码" data-valid="true" />
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<div class="form-check">
|
||||
<input id="remember" name="remember" type="checkbox" class="form-check-input" value="true" /><label for="remember" class="form-check-label">记住我</label>
|
||||
</div>
|
||||
<div class="form-group rememberPwd" onselectstart="return false">
|
||||
<i class="fa fa-square-o"></i>
|
||||
<span>记住密码自动登录</span>
|
||||
<input id="remember" name="remember" type="hidden" value="false" />
|
||||
</div>
|
||||
<button class="btn btn-lg btn-login btn-block" type="submit">登 陆</button>
|
||||
<div class="login-footer">
|
||||
|
|
|
@ -16,6 +16,15 @@
|
|||
padding: 20px;
|
||||
}
|
||||
|
||||
.login-wrap .rememberPwd {
|
||||
cursor: pointer;
|
||||
color: #333;
|
||||
}
|
||||
|
||||
.login-wrap .rememberPwd i {
|
||||
width: 13px;
|
||||
}
|
||||
|
||||
.login-footer a:last-child {
|
||||
float: right;
|
||||
}
|
||||
|
@ -29,7 +38,7 @@
|
|||
box-shadow: 0 4px #e56b60;
|
||||
margin-bottom: 20px;
|
||||
outline: none !important;
|
||||
margin-top: -8px;
|
||||
margin-top: -4px;
|
||||
}
|
||||
|
||||
.btn-login:focus {
|
||||
|
@ -44,7 +53,3 @@
|
|||
.form-control {
|
||||
border-color: #1ca0e9;
|
||||
}
|
||||
|
||||
.form-check-label {
|
||||
color: #333;
|
||||
}
|
||||
|
|
|
@ -24,4 +24,17 @@
|
|||
}
|
||||
});
|
||||
});
|
||||
})
|
||||
|
||||
$('.rememberPwd').on('click', function () {
|
||||
var $this = $(this);
|
||||
var $check = $this.find('i');
|
||||
var $rem = $('#remember');
|
||||
if ($check.hasClass('fa-square-o')) {
|
||||
$check.addClass('fa-check-square-o').removeClass('fa-square-o');
|
||||
$rem.val('true');
|
||||
} else {
|
||||
$check.addClass('fa-square-o').removeClass('fa-check-square-o');
|
||||
$rem.val('false');
|
||||
}
|
||||
});
|
||||
});
|
Loading…
Reference in New Issue