苹果CMS用户登录模板制作教程

文件目录html/user/login.html

苹果CMSv10用户登录示例：

<!-- 登录表单 -->
<form method="post" action="">
   <h4>账户信息</h4>
   <div class="group">
      <label >账号</label>
      <input type="text" name="user_name"  placeholder="请输入您的登录账号">
   </div>
   <div class="group">
      <label>密码</label>
      <input type="password" name="user_pwd"  placeholder="请输入您的登录密码">
   </div>
   {if condition="$GLOBALS['config']['user']['login_verify'] eq 1"}
   <div class="group">
      <label>验证码</label>
      <input type="text" name="verify" placeholder="请输入验证码">
      <img src="{:url('verify/index')}" onClick="this.src=this.src+'?'"  alt="单击刷新" />
   </div>
   {/if}
   <input type="button"  value="立即登录">
</form>

<script type="text/javascript">
	$(function(){
		$("body").bind('keyup',function(event) {
			if(event.keyCode==13){ $('#btnLogin').click(); }
		});
		$('#btn_submit').click(function() {
			if ($('#user_name').val()  == '') { alert('请输入用户！'); $("#user_name").focus(); return false; }
			if ($('#user_pwd').val()  == '') { alert('请输入密码！'); $("#user_pwd").focus(); return false; }
			if ($('#verify').length> 0 && $('#verify').val()  == '') { alert('请输入验证码！'); $("#verify").focus(); return false; }
			$.ajax({
				url: "{:url('user/login')}",
				type: "post",
				dataType: "json",
				data: $('#fm').serialize(),
				beforeSend: function () {
					$("#btn_submit").css("background","#fd6a6a").val("loading...");
				},
				success: function (r) {
					if(r.code==1){
						location.href="{:url('user/index')}";
					}
					else{
						alert(r.msg);
						$('#verify_img').click();
					}
				},
				complete: function () {
					$("#btn_submit").css("background","#fa4646").val("立即登录");
				}
			});
		});
	});
</script>