Question

我必须使用Struts2开发一个项目＆amp;道场。我想通过单击按钮创建一个包含Dojo小部件的div 例如：

 <s:form data-dojo-type="dijit.form.Form" 
        data-dojo-props="method: 'post',
        action: 'myAction'"
        theme="simple">
    <s:div id="myId">
        <s:textfield
            name="aName"
            data-dojo-type="dijit.form.TimeTextBox"
            data-dojo-props="name: 'aName'" />
        // More Dojo widgets ...
    </s:div>
</s:form>

我想要一个“复制”“myDiv”Div的Javascript函数，并将它放在te previous下面，依此类推......

最终结果可能是这样的：

 <s:form data-dojo-type="dijit.form.Form" 
        data-dojo-props="method: 'post',
        action: 'myAction'"
        theme="simple">
    <s:div id="myId">
        <s:textfield
            name="aName"
            data-dojo-type="dijit.form.TimeTextBox"
            data-dojo-props="name: 'aName'" />
        // More Dojo widgets ...
    </s:div>
    <s:div id="myId_2">
        <s:textfield
            name="aName"
            data-dojo-type="dijit.form.TimeTextBox"
            data-dojo-props="name: 'aName'" />
        // More Dojo widgets ...
    </s:div>
    <s:div id="myId_3">
        <s:textfield
            name="aName"
            data-dojo-type="dijit.form.TimeTextBox"
            data-dojo-props="name: 'aName'" />
        // More Dojo widgets ...
    </s:div>
</s:form>

感谢您的帮助

Answer 1

使用内部dijit克隆DOM节点可能有点棘手。 dojo.clone函数将克隆dijits的DOM节点，但不会调用dojo.connect，将其注册到dijit注册表等等。你会得到看起来像dijits的盒子，但是不起作用。考虑它有点像复印小册子，但不能将页面装订在一起。

最好的办法是在Dojo的解析器解析它之前复制myDiv。这意味着您不能在Dojo配置中将parseOnLoad设置为true。

例如，制作克隆并将其存储在dojo.ready中的某个位置并在末尾手动运行解析器：

var clonableDiv, 
    numClones = 0;

dojo.ready(function()
{
    clonableDiv = dojo.clone( dojo.byId("myId") );
    dojo.parser.parse();
});

现在，假设您有一个ID为“myButton”的按钮，用于将克隆添加到表单中：

dojo.connect("myButton", "onclick", function()
{
    var newClone = dojo.clone(clonableDiv);
    newClone.setAttribute("id", "myId_" + numClones);
    newClone.childNodes[1].setAttribute("data-dojo-props", "name: 'aName_" + numClones + "'");
    dojo.place(newClone, dojo.byId("myId"), "after");
    numClones++;
    dojo.parser.parse(newClone);
});

这里有几点需要注意。首先，您必须确保不在文档中插入重复的ID。输入字段的名称属性也是如此。此外，在插入克隆之后，您需要显式解析新插入的div。

它确实有点混乱，特别是如果您有多个节点或小部件，其中包含ID或名称，您必须确保它们是唯一的。在某些时候，以编程方式构建所有内容而不是克隆myId甚至可能同样整洁。或者，您可以为可重复区域创建自定义窗口小部件。

使用Dojo内容动态创建（或复制）div

1 个答案: