artDialog/_doc/ajaxContent/login.html

这里只显示每个文件的开头 60 行。登录后可以解锁完整代码。

微信扫码关注公众号，代码整理好后第一时间通知你。

<form id="login-form" action="?login" method="post">
<p><label>帐号：<input id="login-form-username" name="username" type="text"></label></p>
<p><label>密码：<input id="login-form-password" name="password" type="password"></label></p>
</form>
<!-- IE8 style 标签写在HTML片段下方才能生效 -->
<style>
#login-form p { padding:5px;  }
#login-form input { width:15em; padding:4px; border:1px solid #CCC; }
#login-form input:focus { border-color:#426DC9; }
#login-form .login-form-error { background:#FFFBFC; border-color:#F00 !important; }
</style>
<!--
	1、 script的类型如果是 text/dialog ，将会在对话框内部执行（类似init参数的回调），变量不会污染全局
    2、 如果使用jquery.artDialog，标准script的标签也能被执行
    3、 本页编码要与对话框所在页面编码保持一致
-->
<script type="text/dialog">
var api = this,// 对话框扩展方法
	$ = function (id) {return document.getElementById(id)},
	form = $('login-form'),
	username = $('login-form-username'),
	password = $('login-form-password');

// 操作对话框
api.title('系统登录')
	// 自定义按钮
	.button(
		{
			name: '登录',
			callback: function () {
				if (check(username) && check(password)) form.submit();
				return false;
			},
			focus: true
		},
		{
			name: '取消'
		}
		/*, 更多按钮.. */
	)
	// 锁屏
	.lock();
	
username.focus();

// 表单验证
var check = function (input) {
	if (input.value === '') {
		inputError(input);
		input.focus();
		return false;
	} else {
		return true;
	};
};

// 输入错误提示
var inputError = function (input) {
	clearTimeout(inputError.timer);
	var num = 0;