登陆窗口实现dojo

来源:互联网 发布:淘宝网夏天零食店 编辑:程序博客网 时间:2024/05/16 15:27

dojo配置参照前一篇文章......一个比较实用的好看的登陆界面

<html>
 <head>
  <title>评估系统登陆界面</title>
  <script type="text/javascript" src="dojojs/dojo.js"></script> 
  <script type="text/javascript">
   dojo.require("dojo.widget.Dialog");
         dojo.require("dojo.widget.Button");

var dlg0, dlg1, dlg2, dlg3;
function init() {
 dlg0 = dojo.widget.byId("dialog0");
 var btn = document.getElementById("cancel");
 //设置对话框的关闭控件
 dlg0.setCloseControl(btn);
 /* var btn = document.getElementById("hider1");
 dlg1.setCloseControl(btn);*/
  dlg1 = dojo.widget.byId("dialog1");
 var btn1 = document.getElementById("cancel1");
 //设置对话框的关闭控件
 dlg1.setCloseControl(btn1);
   dlg2 = dojo.widget.byId("dialog2");
 var btn2 = document.getElementById("cancel2");
 //设置对话框的关闭控件
 dlg2.setCloseControl(btn2);

}
dojo.addOnLoad(init);
  </script>
<style type="text/css"> 
 /* 设置对话框的CSS样式 */
 .dojoDialog {
  background : #772299;
  border : 1px solid #999;
  -moz-border-radius : 5px;
  padding : 4px;
 }
</style>
 </head>
 <body>
 <h1  align="center"><font color="blue">教师评估系统</font></h1>
 <hr>
 <div align="center" >
 <button dojoType="Button" onclick="dlg0.show()">学生登陆</button><br>
  <button dojoType="Button" onclick="dlg1.show()">教师登陆</button><br>
   <button dojoType="Button" onclick="dlg2.show()">管理员登陆</button><br>
 </div>
 <div dojoType="Dialog" id="dialog0" bgColor="blue" bgOpacity="0.5" toggle="fade" toggleDuration="250">
 <form action="111.jsp" method="post" onsubmit="return false;">
  <table>
  <caption>登陆</caption>
   <tr>
    <td>用户名:</td>
    <td><input type="text"></td>
   </tr>
   <tr>
    <td>密&nbsp;&nbsp;码:</td>
    <td><input type="text"></td>
   </tr>

   <tr>
    <td align="right">
     <input type="button" id="submit" value="学生登陆"></td>
    <td align="center"> <input type="button" id="cancel" value="取消"></td>
   </tr>
   </table>
    </form>
</div>
-------------------------------------------------------------------
 <div dojoType="Dialog" id="dialog1" bgColor="blue" bgOpacity="0.5" toggle="fade" toggleDuration="250">
 <form action="/sevlet1" method="post" onsubmit="return false;">
  <table>
  <caption>登陆</caption>
   <tr>
    <td>用户名:</td>
    <td><input type="text"></td>
   </tr>
   <tr>
    <td>密&nbsp;&nbsp;码:</td>
    <td><input type="text"></td>
   </tr>
   <tr>
    <td align="right">
     <input type="button" id="submit1" value="教师登陆"></td>
    <td align="center"> <input type="button" id="cancel1" value="取消"></td>
   </tr>
   </table>
    </form>
</div>
==================================================================
 <div dojoType="Dialog" id="dialog2" bgColor="blue" bgOpacity="0.5" toggle="fade" toggleDuration="250">
 <form action="/servlet" method="post" onsubmit="return false;">
  <table>
  <caption>登陆</caption>
   <tr>
    <td>用户名:</td>
    <td><input type="text"></td>
   </tr>
   <tr>
    <td>密&nbsp;&nbsp;码:</td>
    <td><input type="text"></td>
   </tr>
   <tr>
    <td align="right">
     <input type="button" id="submit2" value="管理员登陆"></td>
    <td align="center"> <input type="button" id="cancel2" value="取消"></td>
   </tr>
   </table>
    </form>
</div>
 </body>
</html>

单击按钮