动态创建（或复制）包含Dojo内容的div

我必须使用Struts2 & Dojo开发一个项目。我想通过点击一个按钮来创建一个包含Dojo小部件的div。
例如：动态创建（或复制）包含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>

我想的JavaScript函数“重复”的“myDiv”事业部，并将其置于TE前一个，依此类推......

最终的结果可能是类似的东西：

<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>

谢谢您的帮助

来源

2011-11-21 Vince

克隆DOM与dijit的内部节点可以是有点棘手。 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。或者，您可以为可重复区域创建自定义小部件。

来源

2011-11-22 10:55:01 Frode

动态创建（或复制）包含Dojo内容的div

回答

相关问题