Dojo中文使用手册
- 1、下载文档前请自行甄别文档内容的完整性，平台不提供额外的编辑、内容补充、找答案等附加服务。
- 2、"仅部分预览"的文档,不可在线预览部分如存在完整性等问题,可反馈申请退款(可完整预览的文档不适用该条件!)。
- 3、如文档侵犯您的权益，请联系客服反馈,我们会尽快为您处理(人工客服工作时间：9:00-18:30)。
Dojo中文使用手册
本手册针对0.9、1.0及1.x版本。
目录
快速安装
Hello World-第一个程序
程序调试
第一部分：使用Dojo-Dojo和Dijit例子
第一个例子：为什么一些人不填写传真表单？
第二个例子：总是点击两次
第三个例子：和技术人员交谈
第二部分Dijit-Dojo的小部件库
概述
共用特征
表单、验证和个性化的文本输入框
表单小部件
复选框、单选框、切换（？）
组合框（ComboBox）
下拉过滤选择框（FilteringSelect）
数字选择框（NumberSpinner）
滑尺（Slider）
文本输入域（Textarea）
文本框类（验证、货币、数字、日期、时间）
布局（只讲一个tabContainer）
命令控制
按钮、组合按钮和下拉按钮
菜单
工具菜单
用户使用帮助提示和反馈
进度条
提示
对话框和工具对话框
页框（TitlePane）
高级功能（只讲一个Tree）
树（Tree）
第三部分：使用Dojo和Dijit与javascript协作通用性
初始对象
模块
建立和设计小部件
自已设计小部件类
事件系统
异步交互XMLHttpRequest(XHR)
拖拽
使用Dojo.Data接口
使用dojo.query选择DOM节点
回退按钮
其它功能
多个版本共处于一个页面
第四部分：调试
第五部分：Dojox扩展包
cometd(客户端)
dojox图表
dojox集合
dojox加密
dojox数据
dojox网格（翻译）
dojox离线（翻译）
快速安装
Dojo 提供了三种安装方式:
1.使用美国在线(AOL)的内容分发网络(CDN)上的dojo.
2.在本地使用dojo的一个稳定版本.
3.从dojo网站的SVN服务器上获取的最新代码.
使用内容分发网络(CDN)上的Dojo
这种方法非常的快捷!你能够通过添加一个<script> 到美国在线(AOL)的内容分发网络(CDN)上,而无需占用你服务器上的任何空间和资源.
所有在这本手册里出现的Dijit范例均通过此方法获取Dojo的js文件.你可以直接拷贝粘贴第1,2部分的任何例子到你自己的服务器上就可以正常的运行了!在第3部分的例子中,因为很多是一些代码片段,所以我们将提醒您如何做一些更改以便使这些例子正常运行. 您可以使用: <script type="text/javascript"
src="/dojo/1.0.0/dojo/dojo.xd.js"></script> 来引用Dojo的js 文件
请参考: Dojo And AOL获取最新的引用链接.
使用本地的Dojo
如果您是Dojo的传统用户,你可以以以往的方式下载,安装,并且使用Dojo.
1.从/downloads下载最新的Dojo
2.解压缩文件到本地服务器上. 假设您将文件安装到/js目录下,其目录结构应该如
下(注：dojo1.2.3版本与本目录不相同，只有dojo、dijit、dojox三个子目录)。
3.从您的浏览器中打开/js/dijit/themes/themeTester.html
你就能够看到如下页面:
这样你就已经成功安装Dojo了!
这篇教程的目的是提供一个新手学习和了解Dojo的窗口。
虽然内容不可能覆盖所有的细节信息(因为过多的细节对新手可能会产生负面影响),但是我们任然尽量将Dojo的大部分特性都介绍给大家.至于那些介绍到的概念等信息,您可以参考本文末尾的连接( 获取更多资源一节 Finding More Resources )
Hello World第一个程序
准备工作
首先你当然需要Dojo 了。
你可以到获取稳定的版本.接着，你需要一个网络服务器,无论是跑在Linux,Windows还是Mac上,Dojo的Javascript库均会从你的服务器按需的下载到本地.不过,这个文档中的AJAX例子需要服务器端的语言支持,如PHP,ASP等.
跑在客户端的Dojo以及Dijit代码已证实可以在IE6,7,Firefox 2 和Safari上正常运行. 建立Dojo
首先,你需要在服务器端创建一个文件夹,取名为"HelloWorldTutorial"然后创建再创建一个取名为"dojoroot".最后,使用任何解压缩工具将Dojo压缩包解压缩到
/HelloWorldTutorial/dojoroot. 目录结构如下:
正式开始
当我们完成了上述准备工作,我们需要将Javascript 组件放入我们的HTML页面当中.代码如下:
<html>
<head>
<title>Dojo: Hello World!</title>
<!-- SECTION 1 -->
<style type="text/css">
@import "dojoroot/dijit/themes/tundra/tundra.css"
@import "dojoroot/dojo/resources/dojo.css"
</style>
<script type="text/javascript" src="dojoroot/dojo/dojo.js"
djConfig="parseOnLoad: true"></script>
</head>
<body class="tundra">
</body>
</html>
正如你所看到的,这是一个个标准的HTML,其包含三个元素:
* 两个CSS 文件. tundra.css是在本范例中Dijit使用的主题风格.
* 在head标签里的脚本元素(script element). 这个脚本元素负责加载基本的Dojo脚本,其作用是提供动态加载其他Dojo功能的能力.
* 最后,我们将trundra作为body标签的class属性值.
创建一个按钮小部件(Button Widget)
好了,现在是最令人兴奋的部分!在这个例子里我们将创建一个拥有"Hello World!"文字的按钮小部件.在这里,我们将获取三个事件(mouseOut,mouseOver,mouseDown),这样,我们就能做一些其他事情,比如提高用户体验等.
我们要做的第一步是告诉Dojo去动态加载哪些模块.在head标签里,添加另外一个部分(这部分称作 section 2)到section 1下面:
<!-- SECTION 2 -->
<script type="text/javascript">
// Load Dojo's code relating to the Button widget
dojo.require("dijit.form.Button");
</script>
dojo.require 作用是通知Dojo加载按钮的小部件(Button widget).如果不加这一行,下面的代码将不能被Dojo解析,这样得到的将是普通的HTML 按钮.
然后,请将下面的代码插入到html的body部分中.
<button dojoType="dijit.form.Button" id="helloButton">Hello World!</button>
这段代码当中最关键的是dojoType属性.这个dojoType 属性负责通知Dojo在页面加载时如何处理这个元素.在这里,我们使用的是button元素而不是input元素.事实上,两者都是可以被Dojo识别的.前提是只要元素里存在dojoType属性.值得注意的是如果我们用input 元素来显示按钮元素,我们应该使用input中的value属性来显示希望出现的字符.
将一个事件和小部件相连起来
如果点击这个按钮触发事件,Dojo将如何处理呢?我们只需要为这个按钮添加一个onClick 事件处理函数.不过,Dojo还提供了一套简单而有效的办法: Dojo 事件系统( Dojo event system)!
这种简单的绑定事件的方法是通过一个脚本标签(script tag)来绑定事件.当然,这不是一个简单的脚本标签,它包含了一个"dojo/method"的type 属性.就像这样:
<button dojoType="dijit.form.Button" id="helloButton">
Hello World!
<script type="dojo/method" event="onClick">
alert('You pressed the button');
</script>
</button>
是不是很简单？将脚本片段插入到标签当中的确是一个好主意。
并且你还可以在脚本中利用DOM Level2事件的全部功能。
也就是说，你可以检测到SHIFT和CTRL键，获取所有的事件属性，以及HTML树在事件的冒泡阶段获取事件信息等。
如果你曾经使用过DOM Level2的事件，你就能理解IE与Firefox有多大差别了。
通过使用Dojo，你不用多做任何处理就能很好的支持不同的浏览器。
这也是Dojo的强大所在。
通过服务器获取数据
当你点击按钮就弹出一个对话框很不错吧？！但如果我们想从服务器获取数据怎么办？Dojo 使用一个简洁的方法完成这一复杂的功能- dojo.xhrGet。
为了引用方便，我们标记这一节代码在附带代码一节为 HelloWorld-Section5.html 和 response.txt。
首先，当数据从服务端返回时，我们需要一个回调函数去处理数据。
将下面的代码插入到head标签里：
<script>
function helloCallback(data,ioArgs) {
alert(data);
}
function helloError(data, ioArgs) {
alert('Error when retrieving data from the server!');
}
</script>
这里的两个参数很重要，请不要删除任意一个。
第一个参数: data 包含了从服务端返回的数据，第二个参数ioArgs包含了Dojo I/O 绑定对象(Bind object)。
我们现在只考虑第一个参数。
第二步是使点击按钮触发服务端请求。
将下面的代码：
<script type="dojo/method" event="onclick">
alert('You pressed the button');
改为：
<script type="dojo/method" event="onClick">
dojo.xhrGet({
url: 'response.txt',
load: helloCallback,
error: helloError
});
</script>
上面的代码主要目的是告诉Dojo查询指定的url，并且定义回调函数处理服务器端返回的数据。
而后，我们需要在与HelloWorld相同路径下创建另外一个名为response.txt的文件。
在这个文件中，你可以写上一些文字，比如:"Welcome to the Dojo Hello World Tutorial"。
现在，如果你点击按钮，一个javascript的对话框将显示response.txt中的内容。
真的很容易！
下一步，我们将看看如何通过服务器端请求做一些有意义的事情。
使用GET方法向服务器端传送数据
从服务端传回静态的数据是个不错的开始。
但是在现实生活中却并不常见。
我们更需要提交一些信息供服务器端处理。
在这一节中，我们将使用GET方法，而下一节我们将使用POST 方法实现这一目标。
为了引用方便，我们标记这一节代码在附带代码一节为HelloWorld-Section6.html。
服务器端代码文件为："HelloWorldResponseGET."分别有以下几个后缀的文件：ASP('.asp'),PHP('.php'),ColdFusion('.cfm')或者Java('jsp')。
首先，在HelloWorld.html里需要添加一个输入框(Input Element)。
将一下部分：
<button dojoType="dijit.form.Button" id="helloButton">
Hello World!
<script type="dojo/method" event="onClick">
dojo.xhrGet({
url: 'HelloWorldResponseGET.php',
load: helloCallback,
error: helloError,
content: {name: dojo.byId('name').value }
});
</script>
</button>
Please enter your name: <input type="text" id="name">
换为：
<button dojoType="dijit.form.Button" id="helloButton">
Hello World!
<script type="dojo/method" event="onClick">
dojo.xhrGet({
url: 'HelloWorldResponseGET.php',
load: helloCallback,
error: helloError,
content: {name: dojo.byId('name').value }
</script>
</button>
Please enter your name: <input type="text" id="name">
在下一步之前,我们需要注意的是在dojo.xhrGet方法中的url属性应该设置成与你的服务器环境相匹配的地址,如果你用ASP的服务器,则应该使用'HelloWorldResponseGET.asp' 而不是'HelloWorldResponseGET.php',相似的,如果你使用ColdFusion服务器,则应该使用'HelloWorldResponseGET.cfm',如果是JSP服务器,则应该使用'HelloWorldResponseGET.jsp'等等.这些代码都将在下一节中出现,并且能够在本教程最后的附件中找到.
在上面的代码中,你可以注意到有一个新的参数传递到dojo.xhrGet方法中,这个新的属性content允许程序员将任意的值作为参数传递给服务器端.在本例中,因为我们使用的是dojo.io.bind的默认方法:GET方法,所以服务器端通过GET的一个参数'name',得到文本框中的值.值得注意的是,如果服务器端期望的是另外的名字(比如'myName'),我们只需改变内容属性就可以了.如下:
content: {myName: dojo.byId('name').value }
这里的dojo.byId('name').value我们是第一次见到,很简单,其实这个方法是标准的document.getElementById(...)的简单写法.
最后,如果你将你的名字放到文本框中,然后点击"Hello World",一个信息框应该会显示出"Hello , welcome to the world of Dojo!"的信息,而你在文本框中输入的名字就会出现在那里. 下面是服务器端的脚本.一些能够从本页面的最下面下载.
使用PHP服务器
<?php
/*
* HelloWorldResponseGET.php
* --------
*
* Print the name that is passed in the
* 'name' $_GET parameter in a sentence
*/
header('Content-type: text/plain');
print "Hello {$_GET['name']}, welcome to the world of Dojo!n"$$
?>
使用ASP服务器
<%
'
' HelloWorldResponseGET.asp
' --------
'
' Print the name that is passed in the
' 'name' GET parameter in a sentence
'
response.ContentType="text/plain"
response.write("Hello " & request.querystring("name") & ", welcome to the world of Dojo!n")
%>
使用Java(JSP)服务器
<%
/*
' HelloWorldResponseGET.jsp
' --------
'
' Print the name that is passed in the
' 'name' GET parameter in a sentence
*/
response.setContentType("text/plain");
%>
Hello <%= request.getParameter("name") %> , welcome to the world of Dojo!
通过POST方法提交数据
通过GET方法很有用,但是有些时候你却需要在传统的HTML的表单中使用Dojo去提高网站的用户体验.同样,Dojo提供了一个非常友善的方法.你可以从下面部分获得代码,或者,你也可以本文最末的连接处下载.最后提醒一下,就像上一节所述,你同样需要根据服务端脚本类型去改变url属性的值.
首先,我们需要将HelloWorld.html中html代码做一些调整.将:
<br>
Please enter your name: <input type="text" id="name">
变为:
<br>
<form id="myForm" method="POST">
Please enter your name: <input type="text" name="name">
</form>
然后,我们需要改变dojo的方法:
<script type="dojo/method" event="onclick">
dojo.xhrGet({
url: 'HelloWorldResponseGET.php',
load: helloCallback,
error: helloError,
content: {name: dojo.byId('name').value }
});
</script>
变为:
<script type="dojo/method" event="onclick">
// Don't forget to replace the value for 'url' with
// the value of appropriate file for your server
// (i.e. 'HelloWorldResponsePOST.asp') for an ASP server
dojo.xhrPost({
url: 'HelloWorldResponsePOST.php',
load: helloCallback,
error: helloError,
form: 'myForm'
});
</script>
从上面的代码可以看出,我们将dojo.xhrGet变为dojo.xhrPost,我们将content属性删除了,取而代之的是form属性.这样做的目的是通知dojo.xhrPost需要使用表单'myForm'作为数据源.
接下来,你只要点击"Hello World"按钮,应该会弹出一个带有你名字的提示框"Hello , welcome to the world of Dojo!"
使用PHP服务器:
<?php
/*
* HelloWorldResponsePOST.php
* --------
*
* Print the name that is passed in the
* 'name' $_POST parameter in a sentence
*/
header('Content-type: text/plain');
print "Hello {$_POST['name']}, welcome to the world of Dojo!n"$$
?>
使用ASP服务器
<%
'
' HelloWorldResponsePOST.asp
' --------
'
' Print the name that is passed in the
' 'name' $_POST parameter in a sentence
'
response.ContentType="text/plain"
response.write("Hello " & request.form("name") & ", welcome to the world of Dojo!n")
%>
使用ColdFusion服务器
<!---
/*
* HelloWorldResponsePOST.cfm
* --------
*
* Print the name that is passed in the
* 'name' POST parameter in a sentence
*/
--->
<cfsetting showDebugOutput="No">
Hello, ##, welcome to the world of Dojo!
</cfsetting>
使用Java(JSP)服务器
<%
/*
' HelloWorldResponsePOST.jsp
' --------
'
' Print the name that is passed in the
' 'name' POST parameter in a sentence
*/
response.setContentType("text/plain");
%>
Hello <%= request.getParameter("name") %> , welcome to the world of Dojo!
程序调试
可以利用以下调试工具来进行调试。
使用Firebug或者是Firebug Lite
Firebug是最佳的调试工具。
下载地址是：/。
如果您不想用它，那么可以在IE或其它浏览器下使用Firebug Lite。
，但这种方式要求你必须在dojo里包含以下内容：
<script type="text/javascript"
src="/dojo/1.0.0//dojo/dojo.js"
djConfig="parseOnLoad: true, isDebug: true"></script>
第一部分：使用Dojo-Dojo和Dijit例子
第一个例子：为什么一些人不填写传真表单？
第二个例子：总是点击两次
第三个例子：和技术人员交谈
第一部分：使用Dojo-Dojo和Dijit例子
略
第二部分Dijit-Dojo的小部件库
如果你没有使用Dojo的经历，那么从Dijit开始将是个好的起点。
你可以通过它使用很少甚至不需要使用JS来建立符合web2.0的页面。
Dijit有两种使用方式：在html标签里使用特殊属性的声明、通过JS实现。
这两种方式都有相同的选项。
像在第一部分里我们都使用声明的方式使用。
第三部分将展示如何通过程序实现。
Dijit是与它自己的主题绑定的，tundra主题给了针对所有小部件的一个通用的设计和色彩方案。
你可以通过容器或元素的主题重构。
Dijit被设计成通用的-适应用户不同的语言和文化以及相关的不同功能。
语言翻译，双向文本，不同习惯的数字、日期都已经被封装了。
服务器交互后的数据可能并没有考虑到本地习惯。
所有的小部件都允许键盘操作和使用标准的主题，高对比模式的屏幕显示方式。
Dijit概述
Form, Validation, Specialized Input
CheckBox
CurrencyTextBox
FilteringSelect
NumberSpinner
Slider
TextBox
ValidationTextBox
Layout
Border Container (new in 1.1)
StackContainer
Command Control
Menu
User Assistance and Feedback
TooltipDialog
TitlePane（点击展开
或收回）
高级编辑、显示部件
Editor
InlineEditBox 0.9 - 1.0
属性，方法，扩展点
每一个Dijit组件都有交互的点，你可以自定义他们。
属性是用来控制显示或行为的数据元素。
举个例子，ContentPane的标签（label）属性当pane是TabbedContainer的一部分时将显示。
属性只能在创建的时候设置一次。
这就是说，你可以在声明标签中设置它们，或者通过new diji._()来设置它们。
在此之后，你将不能直接设置。
一些属性可以通过方法来改变，即使用setAtrributeName()来实现。
后面我们在适用的时候会讲到。
方法控制某些事情的函数。
举个例子，在NumberSpinner中，用户可以点击上下按钮来调整数字大小。
你可以通过adjust()方法来达到同样的效果。
扩展点是一个你可以重构的函数。
例如，VailiddationTextBox有个isValid()扩展点。
如果你的校验包括几个域或需要更多更强大的规则时，你可以为它写个新的子类来提供你自己的校验函数。
通用属性
这些属性可以指定给任何小部件，作为普通html 属性的补充。
属性 类型或
值
默认值
说明
id
String None
唯一的ID 属性。
如果不唯一，这指定的ID 将被忽略并使用系统生成的ID.是最常用的通用属性。
layoutAlign String Depends onorder within LayoutContainer 只适用youtContainer 中的
Dijit 组件. 可能的值为: "left", "right",
"bottom", "top", 和 "client".
LayoutContainer 和它的子结点可以
left/top/bottom/right 扩展点
方法和扩展点都是JS 函数（译者注：即外部函数和内部函数的区别）。
区别只是在于
含义。
我们用方法表示“程序员通常使用的函数”，而用扩展点表示“Dijit 组件通常调用的函数”。
没有技术上的原因限制你不能调用一个扩展点或重构一个函数，但要慎重。
你可以很容易的提供一个扩展点函数。
例如下面这个ValidationTextBox 扩展： 1.首先找到扩展点，dijit.form.ValidationTextBox.isValid 2.复制函数内容
3.使用方法直接调用： <div dojoType="dijit.form.ValidatingTextBox" isValid="my.form.isValid" ...> <script type="dojo/method" event="isValid">
// Flip a coin to determine validity. *evil laughter!*
return Math.round(Math.random() * 100) % 2 == 0;
</script>
</div>
当然，如果你的isValid函数对多个小部件相同，你不想逐个修改，你可以这样：
1.按上述的前两步操作；
2.写自己的函数：my.form.isValid = function(isFocused) {
// Flip a coin to determine validity. *evil laughter!*
return Math.round(Math.random() * 100) % 2 == 0;
}
3.通过html属性连接到扩展点：<input dojoType="dijit.form.ValidatingTextBox" isValid="my.form.isValid" .../>
你可以对Dijit做的其它事情
你可以改变每个组件的风格，Dijit类，或创建全新的一个主题。
“主题及设计”部分将会告诉你怎么做。
你可以通过程序创建组件。
所有的属性和方法、扩展点都可以通过js操作。
你可以创建一个已有组件的子类，甚至自己写一个小部件。
表单，验证，个性化的文本框
下面的小部件可以用在表单标签内，也可以用在表单标签外。
所有的表单部件继承了下面的属性和方法。
很多都是充当html属性或方法的影子。
如name和id.
dijit.form._FormWidget是表单部件的基类，也就是说，所有的表单部件都将以dijit.form为名称的开始。
属性
disabled Boolean 是否要求本部件与客户交互？使用方法
"disabled='disabled'",或者只是"disabled". 创建后使用
setAttribute("disabled", true/false) 来改变
intermediateChanges Boolean 如果为true，每次触发onChange事件时都会调用setValue
方法。
如果为false,onChange事件触发时将会询问被调用
者。
例如，滑动条是个true时，将在鼠标拖动的任何一
个点时将触发onChange,如果为false,那么只在释放鼠标
时触发onChange。
tabIndex Integer 标签的顺序值
方法
focus 设置部件为当前焦点
getValue 取得部件的值
setValue 设置部件的值
reset 重置部件值为初始值
undo 撤销最后一次修改的部件值
1.1版本中的变化
setAttribute 控制部件的属性，如disabled, readonly等。
但部件的值除外，改变部件的值要使用setValue()/getValue(). 像setDisabled()这样的方法已经取消。
扩展点
onChange 当值改变时触发
表单
尽管你不需在dijit.form.Form中定义dijit 表单元素, 这么做只是让你有更好的方法和扩展点来使用。
dijit.form.Form
对html 表单的重写
getValues 从表单部件的值生成JSON数据结构
isValid 如果每个部件isValid（）都返回true则返回true
setValues 使用json数据填充表单（通过name，部件的值也是通过部件的name生成的）submit 通过程序来提交表单
扩展点
execute 当用户点击提交按钮时使用用户的自定义函数
复选框，单选框，toggle按钮
dijit.form.CheckBox, dijit.form.RadioButton, and dijit.form.ToggleButton捕获用户的选择。
不像其它的按钮，当按下时执行一些操作。
这些按钮更多的是为了表单数据。
toggle按钮可以用在工具栏-加粗的按钮，所以有点像数据按钮，也有点像命令按钮。
例子：
复选框的例子：<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Checkbox Example</title>
<style type="text/css">
@import "/dojo/1.0.0/dijit/themes/tundra/tundra.css";
@import "/dojo/1.0.0/dojo/resources/dojo.css"
</style>
<script type="text/javascript" src="/dojo/1.0.0/dojo/dojo.xd.js"
djConfig="parseOnLoad: true"></script>
<script type="text/javascript">
dojo.require("dojo.parser");
dojo.require("dijit.form.CheckBox");
</script>
</head>
<body class="tundra">
<input id="cb" dojotype="dijit.form.CheckBox"
name="developer" checked="checked" value="on"
type="checkbox" />
<label for="cb"> Are you a Developer </label>
</body></html>
单选按钮的例子：
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Radio Button Example</title>
<style type="text/css">
@import "/dojo/1.0.0/dijit/themes/tundra/tundra.css";
@import "/dojo/1.0.0/dojo/resources/dojo.css"
</style>
<script type="text/javascript" src="/dojo/1.0.0/dojo/dojo.xd.js"
djConfig="parseOnLoad: true"></script>
<script type="text/javascript">
dojo.require("dojo.parser");
dojo.require("dijit.form.CheckBox");
</script>
</head>
<body class="tundra">
<input dojoType="dijit.form.RadioButton" id="sum1" name="album"
checked="checked" value="metallica" type="radio" />
<label for="sum1"> Metallica </label>
<input dojotype="dijit.form.RadioButton" id="sum2" name="album"
value="Extreme" type="radio" />
<label for="sum2"> Extreme </label>
<input dojotype="dijit.form.RadioButton" id="sum3" name="album"
value="Slayer" type="radio" />
<label for="sum3"> Slayer </label>
</body></html>
注意：复选和单选按钮都是定义在dijit.form.CheckBox里，务必注意。
属性
checked String 使用方法："checked='checked'" 或"checked". True 表
示被选择.使用setChecked() 来改变创建后的值
方法
如果为true表示选择。
setValue(/* Boolean */
checked)
onClick(/*Event*/ e) 单击事件
键盘操作
Tab在表单元素中移动，只会使之获得焦点。
部件键盘操作
ToggleButton 空格键
Checkbox 空格键
RadioButton 方向键，上下左右。
上左表示前一个，下右表示下一个。
组合框(Combobox)
组合框是介于select标签和文本框之间的一个组件。
和select一样，提供了一个可选择值的列表（option），与select不同的是，和text一样，你可以忽略所有的选择项并属于任何你需要的信息。
这特别适用于广泛的多种答案的问题。
有两个域-一个是select选择域，一个是文本输入域-你可以只用其中的一个。
注意，select总是有键/值对，如有option属性，并有键/值对。
组合框(ComboBox)不是这样的，只能通过显示的文本-和文本框一样。
例子：
固定选项方式使用ComboBox非常类似<select>标签：
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Simple ComboBox</title>
<style type="text/css">
@import
"/dojo/1.0.0/dijit/themes/tundra/tundra.css";
@import "/dojo/1.0.0/dojo/resources/dojo.css"
</style>
<script type="text/javascript" src="/dojo/1.0.0/dojo/dojo.xd.js"
djConfig="parseOnLoad: true"></script>
<script type="text/javascript">
dojo.require("dojo.parser");
dojo.require("boBox");
function setVal1(value) {
console.debug("Selected "+value);
}
</script>
</head>
<body class="tundra">
<select name="state1"
dojoType="boBox"
autocomplete="false"
value="California"
onChange="setVal1">
<option selected="selected">California</option>
<option >Illinois</option>
<option >New York</option>
<option >Texas</option>
</select>
</body></html>
该标签实现了值和自动完成功能。
value属性可以设置默认值。
option标签没有隐藏的提交值；如果要使用隐藏的值，那么你必须用FilterSelect，而不能用ComboBox。
特别注意：ie7只有选择的option的值，对默认选中的值被忽略了。
为了对选中的属性值不忽略，你必须对默认的值也设置option。
ComboBox可以使用dojo.Data
Combobox,FilterSelect,Tree和Grid都可以使用dojo.Data。
这就是说，你可以使用option和tree来指定页面的数据，当然这个dojo.data是从服务器端获得的。
统一的dojo.data能从各种渠道得到数据，包括数据库，web serivce,等。
可以查看dojo.data手册来了解详细的信息。
<div dojoType="dojo.data.ItemFileReadStore" jsId="stateStore"
url="states.txt"></div>
看起来像个部件，但它确实不是。
（只有来源于dijit._的dojoType是部件）。
这个标签利用了dojo.parser的优点，可以使用标准的html创建js对象。
你可以查看dojo.parser来了解详细的信息。
下面的例子使用了json数据，你可以下载states.txt，下面是个摘录：
{
identifier:"abbreviation",
items: [
{name:"Alabama", label:"Alabama",abbreviation:"AL"},
{name:"Alaska", label:"Alaska",abbreviation:"AK"},
{name:"American Samoa", label:"American Samoa",abbreviation:"AS"},
{name:"Arizona", label:"Arizona",abbreviation:"AZ"},
下面的例子使用了上述json数据：
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Simple ComboBox</title>
<style type="text/css">
@import
"/dojo/1.0.0/dijit/themes/tundra/tundra.css";
@import "/dojo/1.0.0/dojo/resources/dojo.css"
</style>
<script type="text/javascript" src="/dojo/1.0.0/dojo/dojo.xd.js"
djConfig="parseOnLoad: true"></script>
<script type="text/javascript">
dojo.require("dojo.parser");
dojo.require("boBox");
dojo.require("dojo.data.ItemFileReadStore");
function setVal2(value) {
console.debug("Selected "+value);
}
</script>
</head>
<body class="tundra">
<div dojoType="dojo.data.ItemFileReadStore" jsId="stateStore"
url="states.txt"></div>
<input dojoType="boBox"
store="stateStore"
value="California"
searchAttr="name"
name="state2"
onChange="setVal2" />
</body></html>
jsId是url指定的全局变量的名字。
jsId能从指定的url里提取数据，比如一个服务器端的应用。
如果不使用url属性，你可以使用data属性直接嵌入数据。
boBox
自动填充文本域，下拉列表值来自于数据提供值的类，这个类返回一个列表，这个列表是基于你输入的字符。