Question

我需要编写一个代码，将一组表单值复制到另一组表单中。通常它是通过以下方式完成的：

<script type="text/javascript">
function copyGroup() {
    if(document.formName.copy[0].checked){
        document.formName.a1.value = document.formName.b1.value;
        document.formName.a2.value = document.formName.b2.value;
        document.formName.a3.value = document.formName.b3.value;
    }
}
</script>

<form name="formName">
    <input type="text" name="a1">
    <br>
    <input type="text" name="a2">
    <br>
    <input type="text" name="a3">
    <br>
    <input type="checkbox" name="copy" onSelect="copyGroup()"> Copy Group 1
    <br>
    <input type="text" name="b1">
    <br>
    <input type="text" name="b2">
    <br>
    <input type="text" name="b3">
    <br>
    <input type="submit">
</form>

但是，我想以这样的方式修改它：如果选中该复选框并且用户返回并修改了组1中的任何值 - 组2中的相应字段也会更新。

我认为可以做到，但不确定如何。

感谢。

Answer 1

使用jQuery并尝试这样的事情

http://jsfiddle.net/nA37d/

Answer 2

希望这个帮助：

function copyElement(copyFrom, whereToCopy) {
    if(document.formName.copy.checked){
        document.formName.elements[whereToCopy].value = copyFrom.value;
    }
}
</script>

<form name="formName">
    <input type="text" name="a1" onkeypress="copyElement(this, 'b1')">
    <br>
    <input type="text" name="a2" onkeypress="copyElement(this, 'b2')">
    <br>
    <input type="text" name="a3" onkeypress="copyElement(this, 'b3')">
    <br>
    <input type="checkbox" name="copy"> Copy Group 1
    <br>
    <input type="text" name="b1">
    <br>
    <input type="text" name="b2">
    <br>
    <input type="text" name="b3">
    <br>
    <input type="submit">
</form>

Answer 3

将onchange事件添加到元素并调用您的函数。

Answer 4

一种方法是检查每个输入字段的onchange-events，如果选中复选框，则复制值，但这样会一直复制大量数据，因此效率不高。

另一种方法是使用按钮而不是复选框（具有“复制到其他表单”的值的按钮很难被误解，而复选框是不明确的），并且在按钮的onclick-event触发复制-code。

请注意：我会选择使用jQuery，只需键入$（“＃formName input”）。change（function（stuff））;或类似的东西。

Answer 5

或者您可以随时使用WYSIWYG表单构建器之一。如果您正在寻找令人讨厌的东西，请尝试ActiveForms - 它非常昂贵，但效果很好。

复制表单字段值

5 个答案: