浏览 4045 次
锁定老帖子 主题:HelloWorld
该帖已经被评为良好帖
|
|
---|---|
作者 | 正文 |
发表时间:2006-10-19
http://dojo.jot.com/WikiHome/Tutorials/HelloWorld#Introduction(我永远认为看原文远比看翻译理解的透彻)。 今天要小试Dojo,初次接触,依然从HelloWorld开始: 1. 从它的tutorial中知道,先要建立文件结构,所谓的文件结构,随便建,只是待会用到相对路径的时候能写清楚就可以了 如此: 引用 - HelloWorldTutorial/ | |---- js/ | ---- dojo/ 将 http://dojotoolkit.org/download/下面的release解压到dojo下面 引用 - HelloWorldTutorial/ | |-- js/ | -- dojo/ | -- build.txt -- CHANGELOG -- demos | -- .. -- dojo.js -- dojo.js.uncompressed.js -- iframe_history.html -- LICENSE -- README -- src/ | -- .. 还是那句话自己可以搞清楚相对路径就OK了。 2.例子中用到了dojo组件中的button,风格还真是蛮有特点的,待会就知道了 在HelloWorldTutorial/下面建立HelloWorld.html吧 这是最后整理在一起的文件: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html> <head> <title>Dojo: Hello World!</title> <!-- SECTION 1 --> <script type="text/javascript" src="js/dojo/dojo.js"></script> <!-- SECTION 2 --> <script type="text/javascript"> dojo.require("dojo.event.*"); // Load Dojo's code relating to widget managing functions //dojo.require("dojo.widget.*"); // Load Dojo's code relating to the Button widget dojo.require("dojo.widget.Button"); function helloPressed() { dojo.io.bind({ url: 'response.txt', handler: helloCallback }); } function init() { var helloButton = dojo.widget.byId('helloButton'); dojo.event.connect(helloButton, 'onClick', 'helloPressed') } dojo.addOnLoad(init); function helloCallback(type, data, evt) { if (type == 'error') alert('Error when retrieving data from the server!'); else alert(data); } </script> </head> <body> <button dojoType="Button" widgetId="helloButton">Hello World!</button> </body> </html> 解释一下, 首先你得html文件中需要有dojo自己的 <script type="text/javascript" src="js/dojo/dojo.js"></script> dojo.js文件, 其二,'dojo.require'类似java的import ,可以看到文件中包含了dojo的button,怕麻烦就直接dojo.require("dojo.widget.*");将所有的widget引入,[这样做极其糟糕,不好的编程习惯!] 其三,‘ dojo.require("dojo.event.*");’组件和事件绑定。‘function init()’在html运行后被加载,init()中寻找‘button's id’,绑定相应的事件处理函数。 其四,看看这段代码很有意思: function helloPressed() { dojo.io.bind({ url: 'response.txt', handler: helloCallback }); } 'url':url当然是将数据(=HelloWorldTutorial/下面建立一个'response.txt'文件)送出的了,tutorial上面讲送往服务器,我想这里就本地了,有送就有回,在'服务器'返回数据的时候就调用 handler: helloCallback处理了.'helloCallback'里面的参数顾名思义了. 到此为止已经可以运行这样一个用dojo组件编写的html页面了。 声明:ITeye文章版权属于作者,受法律保护。没有作者书面许可不得转载。
推荐链接
|
|
返回顶楼 | |