Question

我的内容被替换为ajax，但有时一个元素在两个页面上具有相同的ID（即，主页上的照片在图库页面上具有相同的ID）。这意味着当调用dojo.parser.parse时，小部件会尝试重新添加，并抛出以下错误：

Error: Tried to register widget with id==____ but that id is already registered

理想情况下，我想要做的是在AJAX替换的DOM节点上运行destroyRecursive。我已经尝试了以下两种方法，但都没有工作（我相信destroyRecursive是针对小部件而不是DOM？）：

dojo.byId('main').destroyRecursive();
dijit.byId('main').destroyRecursive();

有没有一种很好的方法可以做到这一点，还是我需要尝试确保我的所有ID都不同？

Answer 1

你是在正确的轨道上，你是正确的，destroyRecursive只存在于小部件上。但是，有几种选择可以完成您想要做的事情。

如果您在很大程度上使用小部件，并且有问题的div经常被用作存储包含小部件的内容的存储桶，那么我强烈建议您查看dijit.layout.ContentPane。 ContentPane是一个小部件，主要关注容器的概念，该容器直接或从URL接收内容，URL可能包含也可能不包含小部件。

现在，您可能会在每次更改页面时执行类似的操作：

dojo.xhrGet({
    url: 'something.html',
    load: function(html) {
        dojo.byId('main').innerHTML = html;
        dojo.parser.parse(dojo.byId('main'));
    }
    error: function(error) { ... }
});

使用ContentPane，你可以做同样的事情：

cp.set('href', 'something.html'); //use attr instead of set if < dojo 1.5

有了这个，ContentPane将不仅获取该URL并保存其内容 - 它还将解析其中的任何小部件 - 同样重要的是，它将在替换其内容之前自动销毁其自身内的任何现有小部件。

您可以在Dojo文档中阅读更多相关信息：

或者，如果您不想使用小部件来保存您的内容，您可以在div中查找小部件并自行销毁它们。这是最简单的方法：

dojo.forEach(dijit.findWidgets(dojo.byId('main')), function(w) {
    w.destroyRecursive();
});

Answer 2

dojo.query('selector').forEach(function(node){
   dijit.byNode(node).destroyRecursive(true);
});

基本上，选择节点......您可以使用dojo.byNode(node)，然后destroyRecursive(true);

获取映射为窗口小部件对象

Answer 3

我解决了类似的问题，只需在使用 dijit.registry.remove（＆＃39; idName＆＃39;）从 destroyRecursive（false）中删除内容后从注册表中删除，在重新加载之前。

    if(typeof registry.byId("tableOfContents") != "undefined"){
        registry.byId("tableOfContents").destroyRecursive(false);
        dijit.registry.remove('tableOfContents');
    }

Answer 4

如果您要在页面上销毁多个小部件，以下解决方案适用于我。

var widg = dijit.findWidgets(dojo.byId('root-id')); // root-id is top div id which encloses all widgets
 $(widg).each(function(){

    dijit.byId($(this).attr("id")).destroy(true);

  });

dojo：通过dom节点销毁所有小部件

4 个答案: