登陆窗口实现dojo

最新推荐文章于 2020-08-21 10:24:53 发布
最新推荐文章于 2020-08-21 10:24:53 发布
阅读量3.2k 收藏
点赞数
文章标签： dojo button dialog action input table
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/GXZheng1985/article/details/1859878
版权

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" οnclick="dlg0.show()">学生登陆</button><br>
  <button dojoType="Button" οnclick="dlg1.show()">教师登陆</button><br>
   <button dojoType="Button" οnclick="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" οnsubmit="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" οnsubmit="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" οnsubmit="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>

单击按钮
 

GXZheng1985
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
dojo实现登陆框架
09-28
dojo 实现登陆框架 浪曦的那个谁讲的我忘了饿
AJAX之Dojo实现登陆框
01-02
AJAX之Dojo实现登陆框
Jsp实现的web QQ
09-14
这个版本可能包括了基本的聊天功能，如用户注册、登录、私聊、群聊等，同时也可能已经实现了基本的错误处理和安全性措施。 总的来说，"Jsp实现的Web QQ"项目展示了如何将JSP与现代前端框架结合，创建一个功能齐全、...
java开源包3
06-28
JOpenID是一个轻量级的OpenID 2.0 Java客户端，仅50KB+（含源代码），允许任何Web网站通过OpenID支持用户直接登录而无需注册，例如Google Account或Yahoo Account。 JActor的文件持久化组件 JFile JFile 是 JActor ...
java开源包4
06-28
JOpenID是一个轻量级的OpenID 2.0 Java客户端，仅50KB+（含源代码），允许任何Web网站通过OpenID支持用户直接登录而无需注册，例如Google Account或Yahoo Account。 JActor的文件持久化组件 JFile JFile 是 JActor ...
多种精美网页弹出层JS特效
10-09
- 在这个集合中，可能包含了使用jQuery、Prototype、Dojo等JavaScript库实现的弹出层特效，这些库提供了便利的DOM操作和动画API，简化了开发过程。 - 也可能包含原生JavaScript编写的效果，对于理解JavaScript事件...
dojo实现加载新版本js库
专注于Python
08-14 1987
使用dojo后一直纠结js文件内容有更新时如何加载，这两天终于把问题解决了，原来想加一个库文件代替dojo相应的函数，但发现dojo库纠緾得太紧了，就在原文件上改。 加载分两种情况一种dojo.text!加载或不用执行代码，另外一个是作为库加载，这两个要分开处理。 第一种是直接在加载的url后面加入版本号“?v=xxx"。 toUrl = req.toUrl = functi
用dojo构架管理系统web前端
walle1027的专栏
05-21 1202
   在管理系统中，往往更注重组件的完备，功能的可扩展，以及风格的统一，因此在前端组件中，选择了dojo，原因有三点：     1 开源，并且有强大的团队维护     2 组件化设计思想     3 风格统一管理系统后台用j2EE，采用常规的struts2+spring+hibernate+freemarker。前端采用dojo整体构架理念是用一个总的布局页面规定log区，菜单区，功能区，其他信息展示区的布局。当菜单点击的时候，切换功能区。功能区采用iframe加载，保证功能区页面是个独立的html，以便被
系统优化之Dojo优化策略--页面加载机制优化
weixin_34137799的博客
11-29 105
    随着Dojo的名声越来越大，更多的开发者选择使用Dojo作为前端开发的框架。虽然Dojo是一种异步框架，能够借助各种ContentPane快速的搭建起开发框架，并实现异步通信，但有时一个模块包含的内容过多，造成此页面的内容过多，打开该页时就会导致内存飙升，长时间没有响应等问题。下图所示为一业务模块的页面结构图。                在View区域中，包含了多个Widg...
Dojo界面示例
roomy
10-04 365
DOJO Tab 页签界面：   DOJO 上传组件界面：   DOJO 弹出框界面：
快速看到Dojo能做到什么界面？什么风格
只会写HelloWorld的专栏
08-21 122
发现了一个好东西和大家分享。 可以看到四个风格的样子，还有dojo能做什么UI。 https://download.dojotoolkit.org/release-1.9.3/dojo-release-1.9.3/dijit/themes/themeTester.html?theme=tundra https://download.dojotoolkit.org/release-1.9.3/dojo-release-1.9.3/dijit/themes/themeTester.html?theme=c
贴出使用dojo做的经典后台管理页面，这里只是个框架
yipanbo的专栏
03-12 4181
先上图： 代码如下： <% String path = request.getContextPath(); String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/"; %> "> My JSP
DoJo写注册页面
牛栏山矿泉水
07-08 131
1、新建web项目，文件结构如下图： 2、在WebRoot下新建Register.jsp Register.jsp: &lt;%@ page language="java" import="java.util.*" pageEncoding="utf-8"%&gt; &lt;% String path = request.getContextPath(); String baseP...
dojo1.1.0学习总结--简单对话框登陆案例
☆ 海上飞洪 ☆
10-17 928
 页面部分：            对话框案例                    @import "js/dojo-release-1.1.0/dojo/resources/dojo.css";            @import "js/dojo-release-1.1.0/dijit/t
分布式电网动态电压恢复器模拟装置设计与实现.doc
最新发布
07-06
本装置采用DC-AC及AC-DC-AC双重结构，前级采用功率因数校正（PFC）电路完成AC-DC变换，改善输入端电网电能质量。后级采用单相全桥逆变加变压器输出的拓扑结构，输出功率50W。整个系统以TI公司的浮点数字信号控制器TMS320F28335为控制电路核心，采用规则采样法和DSP片内ePWM模块功能实现SPWM波，采用DSP片内12位A/D对各模拟信号进行采集检测，简化了系统设计和成本。本装置具有良好的数字显示功能，采用CPLD自行设计驱动的4.3英寸彩色液晶TFT-LCD非常直观地完成了输出信号波形、频谱特性的在线实时显示，以及输入电压、电流、功率，输出电压、电流、功率，效率，频率，相位差，失真度参数的正确显示。本装置具有开机自检、输入电压欠压及输出过流保护，在过流、欠压故障排除后能自动恢复。
dojo Datagrid 实现数据删除功能
05-31
要在 Dojo Datagrid 中实现数据删除功能，可以按照以下步骤进行： 1. 在 Datagrid 中添加一个列，用于显示删除按钮。 2. 在该列中定义一个自定义单元格模板，用于显示删除按钮。 3. 在该模板中添加一个点击事件处理程序，以便在单击删除按钮时触发删除操作。 4. 在删除操作处理程序中获取要删除的数据行，并将其从数据存储中删除。 以下是一个简单的示例代码，演示如何在 Dojo Datagrid 中实现数据删除功能： ```javascript require(["dojo/_base/lang", "dojo/_base/declare", "dojo/data/ItemFileWriteStore", "dojox/grid/DataGrid", "dojo/domReady!"], function(lang, declare, ItemFileWriteStore, DataGrid){ var data = { identifier: "id", items: [ { id: 1, name: "John Doe", age: 32 }, { id: 2, name: "Jane Smith", age: 25 }, { id: 3, name: "Bob Johnson", age: 45 } ] }; var store = new ItemFileWriteStore({data: data}); var grid = new DataGrid({ structure: [ { name: "Name", field: "name", width: "200px" }, { name: "Age", field: "age", width: "100px" }, { name: "Delete", field: "id", width: "100px", formatter: function(id){ return "<button data-dojo-type='dijit/form/Button'>Delete</button>"; }, cellType: dojox.grid.cells.Cell, editable: false, onClick: function(evt){ var row = grid.getItem(evt.rowIndex); store.deleteItem(row); store.save(); } } ], store: store, rowSelector: "20px" }, "grid"); grid.startup(); }); ``` 在这个示例中，我们添加了一个名为“Delete”的列，用于显示删除按钮。我们定义了一个自定义单元格模板，用于显示一个具有“Delete”标签的按钮。我们还添加了一个事件处理程序，以便在单击按钮时触发删除操作。在该处理程序中，我们获取要删除的数据行，并将其从数据存储中删除。最后，我们使用 ItemFileWriteStore 作为数据存储，并将其与 Datagrid 组件一起使用。 注意：该示例代码仅供参考，具体实现需要根据具体情况进行调整。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值