0 
<div id="tagTree1" class="span-6 border"  style='width:280px;height:400px;overflow:auto;float:left;margin:10px; '>
    <a class="tabheader" style="font-size:large">Data Type</a><br />
    <div class="pane">Refine search by Data Type</div>
</div>

上面的 div(tagTree1) 出现在一个部门广告中。

<div id="newtagTree1" class="span-6 border"  style='width:200px;height:400px;overflow:auto;float:left'>
    <a class="tabheader"><strong>Geographic Location</strong></a><br />
    <div class="pane"><strong>Refine search by geographic location</strong></div>
</div>

newTagTree1 分区出现在另一个分区搜索中。但是两者都具有相同的功能，可以在其中生成子分区，这是写在 js 文件中的。所有子分区在 js 文件中动态生成。他们都使用相同的函数来生成子 div。当我在同一页面中使用它们时遇到问题。如果一个工作正常，那么另一个就不行。谁能告诉我我在这方面犯的错误？

提前致谢。

$.getJSON('/api/TagsApi/Children?id=800002', function (data) {
    //$(tagDiv).empty();

    $.each(data, function (i, item) {
        $("#tagTree1").append(tagTabBuilder(item));
    });

    $("#tagTree1").tabs("#tagTree1 div.pane", { api: true, tabs: 'a', effect: 'slide', onClick: buildChildren, initialIndex: 0 });
});


function tagTabBuilder(tagData) {
    var str = "<input type='checkbox' name='tagchkbox[]' value='" + tagData.ID + "' onClick='startQuery()' /><a class='tabheader '>" + tagData.NAME;

    if (tagData.count == 0) {
        str += " (<span class='el_count' id='t" + tagData.ID + "'>" + tagData.count + "</span>)" + "</a><br/>";
    } else {
        str += " (<span class='el_count' id='t" + tagData.ID + "'><strong>" + tagData.count + "</strong></span>)" + "</a><br/>";
    }
    str += "<div id='tid-" + tagData.ID + "' class='pane tag'><!--Loading subtags. . .<img src='/assets/modules/gaiaModule/shared/images/load-small.gif' />--></div>";
    return str;
}
4

1 回答 1

0

我的猜测是，当他们生成子 div 时，他们会使用相同的 ID 方案生成它们。因此，它们中的任何一个都可以自己生成子 div，但是当它们都包含时，就会出现 ID 冲突。答案是修改子生成代码，例如，将父 div 的 id 作为子 div 的 id 的第一部分。

或者，如果您不需要它们用于 javascript 的其他部分，请将子 div id 完全排除在外。一般来说，我发现最好避免生成节点中的 id 属性，而使用类等。

于 2013-02-07T19:32:46.763 回答