`
大海大
  • 浏览: 2777 次
  • 性别: Icon_minigender_1
  • 来自: 沈阳
最近访客 更多访客>>
文章分类
社区版块
存档分类
最新评论

DOJO学习笔记:简单小例子(一)

 
阅读更多



 学习新技术最好的方式之一就是给出一个简单的例子,本节使用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>

 

  • 大小: 13.3 KB
分享到:
评论

相关推荐

    DOJO 学习笔记 dojo

    一、 Dojo学习笔记(1. 模块与包) 1 二、 Dojo学习笔记(2. djConfig解说) 4 三、 Dojo学习笔记(3. Dojo的基础对象和方法) 6 四、 Dojo学习笔记(4. dojo.string & dojo.lang) 9 五、 Dojo学习笔记(5. dojo.lang.array ...

    dojo学习笔记

    在百度空间看到的一个哥们的dojo学习笔记,写的非常好,有需要的可以下载。

    dojo精品中文教程(包一)

    dojo学习笔记(一)-dojo.io.IO & dojo.io.BrowserIO) dojo学习笔记(三) dojo学习笔记(二) dojo.lang.array & dojo.lang.func & dojo.string.extras dojo学习笔记(六)- ContentPane dojo学习笔记(四)...

    dojo笔记dojo笔记dojo笔记

    dojo笔记dojo笔记dojo笔记dojo笔记dojo笔记dojo笔记dojo笔记dojo笔记dojo笔记dojo笔记dojo笔记

    dojo精品中文教程(包二)

    dojo学习笔记(一)-dojo.io.IO & dojo.io.BrowserIO) dojo学习笔记(三) dojo学习笔记(二) dojo.lang.array & dojo.lang.func & dojo.string.extras dojo学习笔记(六)- ContentPane dojo学习笔记(四)...

    dojo精品中文教程(全)

    dojo学习笔记(一)-dojo.io.IO & dojo.io.BrowserIO) dojo学习笔记(三) dojo学习笔记(二) dojo.lang.array & dojo.lang.func & dojo.string.extras dojo学习笔记(六)- ContentPane dojo学习笔记(四)...

    dojo精品中文教程(包三)

    dojo学习笔记(一)-dojo.io.IO & dojo.io.BrowserIO) dojo学习笔记(三) dojo学习笔记(二) dojo.lang.array & dojo.lang.func & dojo.string.extras dojo学习笔记(六)- ContentPane dojo学习笔记(四)...

    dojo 学习笔记 表单 树形列表

    和前一个树形菜单 大多数例子是基于 PHP 的 发现很多 dojo 学者想下载 dojo 的API…… 结论是:下不到的! 发现很多想下载一些帮助例子,在http://download.dojotoolkit.org/ 下才能找到,进去点版本,比如 ...

    dojo 一个小的例子

    dojo 一个小的例子,大家对dojo如果不是很了解的,可以针对这个例子来练习!!

    dojo学习笔记(web编程必备)

    dojo学习笔记(web编程必备),很好的dojo学习资料

    dojo dojo实例 dojo例子 dojo资料 dojo项目 dojo实战 dojo模块 dojo编程

    dojo dojo实例 dojo例子 dojo资料 dojo项目 dojo实战 dojo模块 dojo编程

    Dojo Toolkit 1.2.0: Dojo + Dijit + DojoX

    Include &lt;SCRIPT TYPE="text/javascript" SRC="dojo/dojo.js"&gt;&lt;/SCRIPT&gt; and you're on your way. Browse to dojo/tests/runTests.html or dijit/themes/themeTester.html to see Dojo in action

    dojo学习...........

    dojo学习 dojo学习 dojo学习 dojo学习 dojo学习

    dojo包和例子

    dojo一个很好的ajax框架,里面有好多例子,可以自己修改相关参数演示

    Dojo简单笔记和权威学习去处

    自己学习的有点笔记,和学习Dojo权威的地方

Global site tag (gtag.js) - Google Analytics