Html 使用下拉提交按钮发布两个表单中的一个

我试图发布两组不同的混合值。每个表单将共享一些用户提交的文本，如姓名和电子邮件

<form method="post" action="url1">
<input type="hidden" name="donate" value="food">
<input type="hidden" name="days" value="30">
<input type="text" name="cans" value="5">
<input type="text" name="full_name" value="">
<input type="text" name="email" value="">
<input type="submit" name="submit" value="join1"/>
</form>

<form method="post" action="url1">
<input type="hidden" name="donate" value="shoes">
<input type="text" name="pairs" value="">
<input type="text" name="style" value="">
<input type="text" name="full_name" value="">
<input type="text" name="email" value="">
<input type="submit" name="submit" value="join2"/>
</form>

<possible dropdown>

---

最好在两个表单之间进行下拉选择并提交。

好吧，如果只使用html，您会遇到问题，因为提交按钮只提交自己的表单。 其他形式的表单也是无效的

然而，这是使用javascript实现目标的一个技巧

通过一个小功能，您可以隐藏除一个表单以外的所有其他表单：

function showform(index){
    var forms = document.forms;
    for(var i=0;i<forms.length;i++)
        forms[i].style.display=(i==index?"block":"none");
}

函数显示格式（索引）{
var forms=document.forms；
对于（var i=0；i我已经看到您规划多表单设置的方式中存在一些设计问题，有更好的技术来处理这个问题-但是我将尝试使用您自己的技术来帮助您

通过使用您自己的示例，这应该适用于您：

<form id="join1" method="post" action="url1">
<input type="hidden" name="donate" value="food">
<input type="hidden" name="days" value="30">
<input type="text" name="cans" value="5">
<input type="text" name="full_name" value="">
<input type="text" name="email" value="">
</form>

<form id="join2" method="post" action="url1">
<input type="hidden" name="donate" value="shoes">
<input type="text" name="pairs" value="">
<input type="text" name="style" value="">
<input type="text" name="full_name" value="">
<input type="text" name="email" value="">
</form>

<select id="formList">
<option value="">Select form..</option>
<option value="join1">Join1</option>
<option value="join2">Join2</option>
</select>
<button id="submitBtn">Submit</button>

该示例还可以作为JSFIDLE提供：

希望能有点帮助

<form id="join1" method="post" action="url1">
<input type="hidden" name="donate" value="food">
<input type="hidden" name="days" value="30">
<input type="text" name="cans" value="5">
<input type="text" name="full_name" value="">
<input type="text" name="email" value="">
</form>

<form id="join2" method="post" action="url1">
<input type="hidden" name="donate" value="shoes">
<input type="text" name="pairs" value="">
<input type="text" name="style" value="">
<input type="text" name="full_name" value="">
<input type="text" name="email" value="">
</form>

<select id="formList">
<option value="">Select form..</option>
<option value="join1">Join1</option>
<option value="join2">Join2</option>
</select>
<button id="submitBtn">Submit</button>

$('#submitBtn').on('click',function(){
    var selectedForm = $('#formList').val();
    if(selectedForm){
        $('#'+ selectedForm).submit();
    }
});