Javascript - 公式 - 嵌套的动态附加子函数答案

【问题标题】：Javascript - formular - nested dynamic appendchild functionsJavascript - 公式 - 嵌套的动态附加子函数
【发布时间】：2010-05-13 00:52:26
【问题描述】：

我有一个表单，它根据单选按钮更改输入字段。

对于文本，会出现一个文本框对于 textarea 出现额外的 2 个字段用于 cols 和 rows 对于选择、复选框和单选，会出现带有 appendchild 的附加字段

看看这里： http://joomla.byethost16.com/php.php

现在我想要的是让用户添加更多的参数，param2，param3等。

不幸的是，我根据这样的单选按钮制作了触发字段的js函数

    function textarea(){    
if (document.getElementById('option2').checked = true){
    document.getElementById('feld').style.display = '';
        document.getElementById('feld2').style.display = '';
        document.getElementById('feld4').style.display = 'none';
}}

这意味着我的表单中没有动态，因为此函数中的 id 还不是动态的，并且 onclick 将触发任何内容或仅触发第一个 param1。

所有参数都应该是这样，但不知何故增加了数字，收音机的 Js 函数也应该采用它们

    <td>Param_1</td>
<td><p>
<input type="radio" onclick='text()' name="option0" id="option0" value="text" checked="yes">text
<input type="radio" onclick='spacer()' name="option0" id="option1" value="spacer">spacer
<input type="radio" onclick='textarea()' name="option0" id="option2" value="textarea">textarea
<input type="radio" onclick='selecta()' name="option0" id="option3" value="select">select
<input type="radio" onclick='radio()' name="option0" id="option4" value="radio">radio
<input type="radio" onclick='checkbox()' name="option0" id="option5" value="checkbox">checkbox</br>
<input type="hidden" name="fields" value="1" id="fields"  />

<div id="feld">
Name <input type="text" name="param1" id="param1" size="40" maxlength="40">
Default<input type="text" name="paramdef1" id="paramdef1" size="40" maxlength="40">
<div id="feld4" style="display:none;">
<input type="text" name="param11" size="40" value="value1" style="display: inline">
<a href=# onclick='add(1)'>add</a>  <a href=# onclick='reset()'>reset</a></div>
</div>

<div id="feld2" style="display:none;">
Columns<input type="text" name="cols1" size="20" maxlength="40">Rows<input type="text" name="rows1" size="20" maxlength="40"></div>


</td>
</tr>

如何使我的表单动态获取（就像我在复选框中执行“添加/重置”一样）并且人们可以添加更多参数？完整代码请到这里查看源代码： http://joomla.byethost16.com/php.php

非常感谢您对此的帮助

【问题讨论】：

什么是参数 2？它是一个文本框列表，就像用户可以继续添加的参数 1 一样吗？参数 2 与其他表单控件（文本、文本区域、选择、单选和复选框）有何关系？
param2,3... 是 param1 的副本/附加子项。但我不知道如何使函数（text、textarea、select、...）动态化，以便它们也可用于以下参数（param2、param3、..）。谢谢

标签： javascript forms dynamic appendchild

【解决方案1】：

我通过使用 $(this) 并通过“单击”绑定到按钮上的每个类来解决它。

另一种解决方案是使用插件，例如http://www.mdelrosso.com/sheepit/index.php?lng=en_GB，它非常好，但依赖于特定结构（您必须在表单上定义一个索引，在大多数情况下必须在处理中使用，因为有些用户可以跳过 index_vars。）

【讨论】：