<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>easyui测试系统登陆</title>
<link rel="stylesheet" type="text/css" href="easyui-1.4.1/themes/default/easyui.css">
<link rel="stylesheet" type="text/css" href="easyui-1.4.1/themes/icon.css">
<link rel="stylesheet" type="text/css" href="easyui-1.4.1/themes/IconExtension.css">
<link rel="stylesheet" type="text/css" href="css/index-easyui.css">
<link rel="stylesheet" type="text/css" href="css/icon.css">
<link rel="stylesheet" type="text/css" href="css/login.css">
<script type="text/javascript" src="easyui-1.4.1/jquery.min.js"></script>
<script type="text/javascript" src="easyui-1.4.1/jquery.easyui.min.js"></script>
</head>
<body >
<div align="left" class="logo" >
</div>
<div id="mainWindow">
<br />
<div align="center">
<form id="loginForm" >
<label>用户名:</label><input id="userName" name="userName" type="text" />
<br />
<br />
<label>密 码:</label><input id="password" name="password" type="password" />
<br />
<br />
<br />
<a class="easyui-linkbutton" οnclick="loginSubmit();" data-options="plain:true,iconCls:'icon-ok'" href="#" >登 陆</a>
<a class="easyui-linkbutton" οnclick="loginReset();" data-options="plain:true,iconCls:'icon-reload1'" href="#" >取 消</a>
</form>
</div>
</div>
</body>
<script type="text/javascript">
$(function(){
$("#mainWindow").window({
width:420,
height:240,
title:'用户登陆',
draggable:false,
closable:false,
collapsible:false,
minimizable:false,
maximizable:false,
resizable:false
});
$("#userName").textbox({
width:230,
height:40,
prompt:'请输入账号',
required:true,
missingMessage:'用户名不能为空!',
iconCls:'icon-2012080412511'
});
$("#password").textbox({
width:230,
height:40,
required:true,
missingMessage:'密码不能为空!',
iconCls:'icon-2012080412263'
});
});
function loginSubmit(){
$.messager.progress();
$("#loginForm").form('submit',{
url:'index.html',
onSubmit:function(){
var isValid = $(this).form('validate');
if (!isValid){
$.messager.progress('close'); // 如果表单是无效的则隐藏进度条
}
return isValid; // 返回false终止表单提交
},
success: function(){
$.messager.progress('close'); // 如果提交成功则隐藏进度条
}
});
}
function loginReset(){
$("#loginForm").form("reset");
}
</script>
</html>