HTML表单 - 在同一页上将值传递给两种不同的表单

问题描述：

我在尝试将值传递给同一页上的两种不同表单时出现问题。该页面填充了16个单选按钮（我为了显示的原因将它们变成了框），并且它们都保持一个值（例如001）。这两种表单工作都以某种方式获取活动/选定的单选按钮值并将其发布到PHP文件中，以便可以进行数据库更改。我使用锚来传递JavaScript提交函数，而不是提交按钮。我曾尝试过两种形式都覆盖整个页面，但仍然没有任何运气。HTML表单 - 在同一页上将值传递给两种不同的表单

我会在下面发布一些代码来帮助你理解。

PS。如果你需要更多的代码来理解，我可以将它发布到pastebin。

<li> 
<form id="form_ready" method="post" action="../backend/screen.php"> 
    <input type="hidden" name="screenid" value="" /> 
    <input type="hidden" name="status" value="" /> 
    <input type="hidden" name="pickupid" value="document.activeElement.value;" /> 
    <a onclick="document.getElementById('form_ready').submit();">READY</a> 
</form> 
</li> 
<li> 
<form id="form_c" method="post" action="../backend/screen.php"> 
    <input type="hidden" name="status" value="" /> 
    <input type="hidden" name="pickupid" value="document.activeElement.value;" /> 
    <a onclick="document.getElementById('form_c').submit();">COLLECTED</a> 
</form> 
</li> 
</ul> 

<div id="content"> 
<div id="container"> 
<div id="table"> 
    <div id="tr1"> 
    <div id="td1"> 
     <input type="radio" name="pickup" id="1" value="001" /> 
     <label for="1"> <span>001</span> </label> 
    </div> 
    <div id="td2"> 
     <input type="radio" name="pickup" id="2" value="002" /> 
     <label for="2"> <span>002</span> </label> 
    </div> 
    <div id="td3"> 
     <input type="radio" name="pickup" id="3" value="003" /> 
     <label for="3"> <span>003</span> </label> 
    </div> 
    <div id="td4"> 
     <input type="radio" name="pickup" id="4" value="004" /> 
     <label for="4"> <span>004</span> </label> 
    </div>

那么，这两种形式之间的唯一区别隐藏“状态”字段的值？你可以拥有一个包含所有控件的窗体，然后在提交之前使用JS来设置隐藏的“状态”的值。或者，如果您使用实际的提交按钮而不是锚点，则可以使用它们来设置“状态”而不是隐藏字段，然后您就不需要任何Javascript。 – nnnnnn

我需要两种形式，因为我们需要显示物品已准备好收集，另一种是将其从拾取屏幕上移除。我想将锚点更改为提交按钮，但我仍然需要能够从选定的单选按钮中获取值。如果您对如何做到这一点有任何想法，请告诉我。谢谢。 – clintgx

答

要回答的意见建议，并只使用一种形式，这里是如何抓住从选定的单选按钮的值：

var inputs = document.getElementsByTagName('input'); 
var valueSelected; 
for (var i = 0; i < inputs.length; i++) { 
    if (inputs[i].checked) valueSelected = inputs[i].value; 
}

valueSelected将包含选定的无线价值。

如果您只是由于某种原因需要将类型缩减为“收音机”，则可以在for循环中检查输入类型为inputs[i]['type'] === 'radio'。

最好将可能仍然是设置一个类为您的“广播”的投入，它将使循环更具体，因此更高效的代码，例如：

<input type="radio" class="myRadio">

并在JS：var inputs = document.getElementsByClassName('myRadio');

感谢您的帮助。有用！ – clintgx

HTML表单 - 在同一页上将值传递给两种不同的表单

相关推荐