为dojo普及做贡献 -A-- Dojo Tree[新版本号 1.x]

Dojo树(先静态测试---树的显示)：

simple.htm

导入dojo

样式(dojo主题)：

<style type="text/css"> @import "../libs/dojo1.4.x/dojo/resources/dojo.css"; @import "../libs/dojo1.4.x/dijit/themes/tundra/tundra.css"; /*设置<a href="https://www.jb51.cc/tag/yemian/" target="_blank" class="keywords">页面</a>样式，必须*/ body { width: 100%; height: 100%; padding: 0px; margin: 0px; } /*让树的<a href="https://www.jb51.cc/tag/wenzi/" target="_blank" class="keywords">文字</a>遇到鼠标后变a over样式*/ .dijitTreeLabel { cursor: pointer; } <style>

JS库:

<script type="text/javascript" src="../libs/dojo1.4.x/dojo/dojo.js" mce_src="libs/dojo1.4.x/dojo/dojo.js" djCon<a href="https://www.jb51.cc/tag/fig/" target="_blank" class="keywords">fig</a>="par<a href="https://www.jb51.cc/tag/SEO/" title="SEO">SEO</a>nLoad: true,isDebug:true,debugAtAllCosts:true"></script> <script type="text/javascript"><!-- dojo.require("dojo.parser"); dojo.require("dojo.data.ItemFileWriteStore"); dojo.require("dijit.Tree"); // --></script>

<!--body必须指定主题，也就是按导入的dojo加个class="tundra" 不然显示不正常-->

树 DIV三步曲

<div dojoType="dojo.data.ItemFileReadStore" url="treeData.json" jsId="jsonData"></div> <div dojoType="dijit.tree.ForestStoreModel" store="jsonData" jsId="jsonModel" rootLabel="管理<a href="https://www.jb51.cc/tag/caidan/" target="_blank" class="keywords">菜单</a>根目录 " childrenAttrs="line,serial"></div> <div dojoType="dijit.Tree" id="tree" model="jsonModel"> <script type="dojo/method" event="onClick" args="item"><!-- last<a href="https://www.jb51.cc/tag/Box/" target="_blank" class="keywords">Box</a>Selected = item; alert("NAME:"+last<a href="https://www.jb51.cc/tag/Box/" target="_blank" class="keywords">Box</a>Selected.title+"/nID:"+last<a href="https://www.jb51.cc/tag/Box/" target="_blank" class="keywords">Box</a>Selected.id+"/nURL:"+last<a href="https://www.jb51.cc/tag/Box/" target="_blank" class="keywords">Box</a>Selected.url); // --></script> </div>

数据(第一步测试用的json)---treeData.json：

必须的两个属性,但值可以根据需要修改,label:'name'是一样的

identifier: 'id',
label: 'title',

{ identifier: 'id',label: 'title',items: [{ id: 987987,title:"987987",priority:"Next Day Air",line: [ { id: '987987-1',qty:1,sku:11761,title: 'Yodeling Pickle',serial: [ { id:'9879870',title:'9879870',url: 1 } ] },{ id: '987987-2',qty:3,sku:11798,title: 'Gummy Tapeworm',serial: [ { id:'9879871',title:'9879871',url: 5},{ id:'9879872',title:'9879872',{ id:'9879873',title:'9879873',weight: 5} ] } ] }] }

代码完成就第一次测试吧----->

从数据库读数据和服务器交互，马上就到-----