Question

我有一个包含多个表单的页面，但是所有表单都需要在产品表单中使用单选按钮的值。以下是我的表格的简化版本，它们都在同一页面上。

<form name="products" method="post" action="" />
<input id="prod_name" name="prod_name" type="radio" value="Product 1" checked />
<input id="prod_name" name="prod_name" type="radio" value="Product 2" />
</form>

<form name="delivery_method1" method="post" action="" />
<input type="hidden" id="item_name" name="item_name" value=""/>
<input type="image" name="submit" value="submit">
</form>

<form name="delivery_method2" method="post" action="" />
<input type="hidden" id="item_name" name="item_name" value=""/>
<input type="image" name="submit" value="submit">
</form>

我知道我应该能够使用JavaScript将“prod_name”的值复制到“item_name”的隐藏字段中，但我尝试了许多解决方案，但它们没有用。

我的JavaScript知识非常少，所以如果有人能够为我提供完整的功能以及如何在表单中执行该功能的详细信息，我将不胜感激。

Answer 1

ID属性应唯一。如果您不需要它们，请删除它们。如果您使用id=...进行样式设置，请将id=的所有出现次序替换为class=，并将CSS中的尖锐（#）替换为点。

提交表单时，仅发送具有name属性的元素这应该有效：

....
<script>
function fill(value) {
    var forms = document.forms;
    for (var i = 0; i < forms.length; i++) {
        if (forms[i].item_name) forms[i].item_name.value = value;
    }
}
</script>
</head>
<body>
...
<form name="products" method="post" action="">
<input onchange="fill(this.value)" name="prod_name" type="radio" value="Product 1" checked />
<input onchange="fill(this.value)" name="prod_name" type="radio" value="Product 2" />
</form>
...

所有表单元素都可以通过form元素的名称访问。所有表单都可以通过document.forms对象访问（通过名称或文档中的索引）。

当无线电选择改变时，调用函数fill()，将this.value作为参数传递。从无线电输入元素的上下文中，this.value指向无线电元素的值。

然后，我们遍历文档中的所有表单。如果item_name是表单中的元素，则更新该值。

将一个表单的值复制到第二个表单的隐藏字段中

1 个答案: