登陆窗口实现dojo_dojo 登录界面例子-优快云博客

本文介绍了一个使用 Dojo 框架实现的教师评估系统的登陆界面设计案例。该界面支持学生、教师及管理员三种角色的登陆，并通过对话框的形式进行交互。每个对话框都包含用户名和密码输入框，以及相应的登陆和取消按钮。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

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>密  码：</td>
    <td><input type="text"></td>
   </tr>

单击按钮