如何制作一个通用的 Jscript 函数来处理动态表单

How to make a generic Jscript function to work with dynamic form

我有这个代码:

<script type="text/javascript">
function populate(){
     s1 = document.ins_form.servizio.value;
     valori = s1.split("|");
     document.ins_form.codice.value = valori[0];
     document.ins_form.costouno.value = valori[1];
}
</script>


<form action="" method="post" name="ins_form" id="ins_form">
<select name="servizio" id="servizio" onchange="populate()">
    <option value="">Choose..</option>
    <option value="100|10">choice one</option>
    <option value="302|32">choice two</option>
  </select>

<input type="text" name="codice" id="codice" readonly="readonly" />
<input type="text" name="costouno" id="costouno" readonly="readonly" />
</form>

这是指特定的输入字段(servizio、codice、costouno),这些字段将由用户的选择填充,具有不同的值,并且效果很好。

我不是 JScript 的魔术师,所以我找不到将此函数转换为通用函数的解决方案,以便能够在动态生成的其他字段上使用它,就像:servizio1,codice1 ,costouno1 和 servizio2,codice2,costouno2 和 servizio3 ecc...

希望它有点清楚,感谢您的帮助。

您可以将表单元素本身传递给函数:

<script type="text/javascript">
function populate(field1, field2, fromDelimitedString){
   valori = fromDelimitedString.split("|");
   field1.value = valori[0];
   field2.value = valori[1];
}
</script>

<form action="" method="post" name="ins_form" id="ins_form">
<select name="servizio" id="servizio" onchange="populate(document.getElementById('codice'),
document.getElementById('costuono'), document.getElementById('servizio').value)">
    <option value="">Choose..</option>
    <option value="100|10">choice one</option>
    <option value="302|32">choice two</option>
</select>

<input type="text" name="codice" id="codice" readonly="readonly" />
<input type="text" name="costouno" id="costouno" readonly="readonly" />
</form>