DOJO学习笔记：简单小例子（一）

于 2011-12-05 22:59:26 发布
阅读量99 收藏
点赞数
文章标签： javascript ViewUI
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/steven2007/article/details/84094730
版权



 学习新技术最好的方式之一就是给出一个简单的例子，本节使用dojo widget做一个简单的WEB界面。实例效果：

 

 

 

 

<%@ page contentType="text/html; charset=UTF-8"%>

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

<title>DOJO Widget</title>

<link rel="stylesheet" type="text/css" href="dojo-release-1.6.1/dijit/themes/tundra/tundra.css" >

<link rel="stylesheet" type="text/css" href="dojo-release-1.6.1/dojo/resources/dojo.css" >

 

<style type="text/css">

         @import "dojo-release-1.6.1/dijit/themes/tundra/tundra.css";

         @import "dojo-release-1.6.1/dojo/resources/dojo.css";

</style>

 

<script type="text/javascript" src="dojo-release-1.6.1/dojo/dojo.js"

         charset="utf-8" djConfig="parseOnLoad: true,isDebug: true">

</script>

 

<script language="JavaScript">

         dojo.require("dojo.parser");

         dojo.require("dijit.form.Button");

         dojo.require("dijit.form.ToggleButton");

         dojo.require("dijit.form.DropDownButton");

         dojo.require("dijit.Menu");

         dojo.require("dijit.form.DateTextBox");

         dojo.require("dijit.layout.TabContainer");

         dojo.require("dijit.layout.ContentPane");

</script>

</head>

<body class="tundra">

 

<button dojoType="dijit.form.Button" iconClass="dijitEditorIcon dijitEditorIconSave" type=submit>

保存

</button>

 

<button dojoType="dijit.form.ToggleButton" iconClass="dijitCheckBoxIcon">

保存

</button>

 

<div dojoType="dijit.form.ComboButton">

         <span>保存</span>

         <div dojoType="dijit.Menu" id="saveMenu1">

                   <div dojoType="dijit.MenuItem" iconClass="dijitEditorIcon dijitEditorIconSave">

                            保存

                   </div>

                   <div dojoType="dijit.MenuItem">另存为...</div>

         </div>

</div>

 

<input id="date1" name="date1" dojoType="dijit.form.DateTextBox" type="text"/>

 

<div dojoType="dijit.layout.TabContainer" style="width:300px;height:200px">

         <div dojoType="dijit.layout.ContentPane" title="Tab1">

                   tab1

         </div>

         <div dojoType="dijit.layout.ContentPane" title="Tab2">

                   tab2

         </div>

</div>

 

</body>

</html>

 

steven2007
关注
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值