Question

dojo api似乎没有加载到我的系统上（IE 8，带有IIS 7.5的Windows 7）。我尝试通过像这样

链接到dojo api来测试这些示例

<script src="http://ajax.googleapis.com/ajax/libs/dojo/1.6.1/dojo/dojo.xd.js"></script>

<script type="text/javascript">
    dojo.require("dojo.lang.*");
    dojo.require("dojo.widget.Tree");
</script>

我还下载了这个库，直接链接到它。

<script type="text/javascript" src="dojo.js">/*_*/</script>

<script type="text/javascript">
    dojo.require("dojo.lang.*");
    dojo.require("dojo.widget.Tree");
</script>

但得到了同样的结果。库脚本不加载树视图。对于dojo libary 1.6.1，IE8，Windows 7或IIS 7.5是否存在问题？

您是否知道具有此功能的树视图：MySQL数据库支持，上下文菜单，添加/删除节点，树支持中的超链接？

感谢。

Answer 1

您需要在dojo.require函数中包含dojo.addOnLoad次调用。使用Dojo跨域构建时需要这样做。

在http://dojotoolkit.org/reference-guide/quickstart/cross-domain.html

了解详情

dojo.addOnLoad(function() {
    dojo.require("dojo.lang.*");
    dojo.require("dojo.widget.Tree");
});

Answer 2

完整的HTML文件，其中dojo api无法加载。

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>Tutorial: Hello Dojo!</title>
    <!-- load Dojo -->
    <script src="http://ajax.googleapis.com/ajax/libs/dojo/1.6.1/dojo/dojo.xd.js"></script>

<script type="text/javascript">
  dojo.addOnLoad() {
    dojo.require("dojo.lang.*");
    dojo.require("dojo.widget.Tree");
  }
</script>

<script type="text/javascript">
var treeDat = {
    treeNodes: [
        { title:"World" },
        { title:"Business",
            children:[
                { title:"News",
                    children:[
                        { title:"Main"},
                        { title:"Company News" },
                        { title:"Economy" }
                    ]
                },
                { title:"Markets" },
                { title:"Technology" },
                { title:"Jobs and Economy" }
            ]
        },
        { title:"Sports" }
    ]
};
</script>

<script type="text/javascript">
var TreeBuilder = {
    buildTreeNodes:function (dataObjs, treeParentNode){
        for(var i=0; i<dataObjs.length;i++){
            var node =  dojo.widget.createWidget("TreeNode",{
                title:dataObjs[i].title,
                expandLevel:99,
                widgetId:(((treeParentNode)?treeParentNode.widgetId:"root_")+"_"+i)
            });
            treeParentNode.addChild(node);
            treeParentNode.registerChild(node,i);
            if(dataObjs[i].children){
                this.buildTreeNodes(dataObjs[i].children, node);
            }
        }
    },
    buildTree:function (){
        var myTreeWidget = dojo.widget.createWidget("Tree",{
            widgetId:"myTreeWidget",
            DNDMode:"between",
            DNDAcceptTypes:["myTreeWidget"]
        });
        this.buildTreeNodes(treeDat.treeNodes,myTreeWidget);
        var treeContainer = document.getElementById("myWidgetContainer");
        var placeHolder = document.getElementById("treePlaceHolder");
        treeContainer.replaceChild(myTreeWidget.domNode,placeHolder);
    }
}
function addTreeContextMenu(){
    var djWdgt = dojo.widget;
    var ctxMenu = djWdgt.createWidget("TreeContextMenu",{});
    ctxMenu.addChild(djWdgt.createWidget(
        "TreeMenuItem",{caption:"Add Child Menu Item"}));
    ctxMenu.addChild(djWdgt.createWidget(
        "TreeMenuItem",{caption:"Delete This Menu Item"}));
    document.body.appendChild(ctxMenu.domNode);
    var myTree = dojo.widget.manager.getWidgetById("myTreeWidget");
    /* Bind the context menu to the tree */
    ctxMenu.listenTree(myTree);
}

dojo.addOnLoad(function(){
    TreeBuilder.buildTree();
    addTreeContextMenu();
    });
</script>

</head>
<body>
<h1>Programmatic Dojo Tree Demo</h1>
<hr />

<div id="myWidgetContainer"
    style="width: 17em; border: solid #888 1px; height:300px;">
    <span id="treePlaceHolder"
        style="background-color:#F00; color:#FFF;">
        Loading tree widget...
    </span>
</div>

</body>
</html>

Dojo / dijit脚本库treeview加载

2 个答案: