Javascript 使用一个提交按钮提交多个表单
我有下面的代码，基本上它执行两个操作。第一个操作是将我的表单数据提交到google电子表格，另一个操作是将我的第二个表单文本框值数据提交到另一个页面文本框值。如何做到这一点Javascript 使用一个提交按钮提交多个表单,javascript,jquery,html,Javascript,Jquery,Html,我有下面的代码，基本上它执行两个操作。第一个操作是将我的表单数据提交到google电子表格，另一个操作是将我的第二个表单文本框值数据提交到另一个页面文本框值。如何做到这一点 <script type="text/javascript"> <!-- function copy_data(val){ var a = document.getElementById(val.id).value document.getElementById("copy_to").value
<script type="text/javascript">
<!--
function copy_data(val){
var a = document.getElementById(val.id).value
document.getElementById("copy_to").value=a
}
//-->
</SCRIPT>
<style type="text/css">
<!--
-->
</style>
</head>
<body >
<script type="text/javascript">var submitted=false;</script>
<iframe name="response_iframe" id="hidden_iframe" style="display:none;" onload="if(submitted){window.location='Thanks.asp';}"></iframe> <form action="https://docs.google.com/spreadsheet/formResponse?formkey=dGtzZnBaYTh4Q1JfanlOUVZhZkVVUVE6MQ&ifq" method="post" target="response_iframe" id="commentForm" onSubmit="submitted=true;">
<!-- #include virtual="/sts/include/header.asp" -->
<!-- ABove this Header YJC -->
<table style="background-color: #FFC ;" width="950" align="center" border="0" summary="VanaBhojnaluBooking_Table">
<tr><td colspan="7"><p class="MsoNormal" align="center" style="text-align:center;"><strong><span style="line-height:115%; font-family:'Arial Rounded MT Bold','sans-serif'; font-size:16.0pt; color:#76923C; ">Karthika Masa Vanabhojanalu – Participation Booking</span></strong></p>
<p class="MsoNormal" align="center" style="text-align:center;"><strong><em><span style="line-height:115%; font-size:20.0pt; color:#7030A0; ">13<sup>th</sup> Nov 2011 - @ West Coast Park - Singapore</span></em></strong></p>
<p class="MsoNormal" align="center" style="text-align:center;"><strong><span style="color:#7030A0; ">Reserve your participation and avail </span><span style="color:red; "> <a target="_blank" href="/STS/programs/VB_2011_info.asp"> DISCOUNT </a></span><span style="color:#7030A0; "> on the ticket</span></strong></p></td> </tr>
<tr>
<th width="37" scope="col"> </th>
<th width="109" rowspan="5" valign="top" class="YJCRED" scope="col"><div align="left"><font size="2"> * Required</font></div></th>
<td width="68" scope="col"><div align="right"><font size="2.5px">Name</font><span class="yj"><span class="yjcred">*</span></span></div></td>
<th colspan="3" scope="col"><label for="Name"></label>
<div align="left">
<input name="entry.0.single" class="required" style="width:487px; height:25px; vertical-align:middle;" type="text" id="entry_0" title="Enter your name" >
</div></th>
<th width="223" scope="col"> </th>
</tr>
<tr>
<td> </td>
<td><div align="right"><font size="2.5px">Phone</font><span class="yj"><span class="yjcred">*</span></span></div></td>
<td width="107"><input name="entry.1.single" class="required" title="Handphone Number with out +65" maxlength="8" style="width:100px;height:25px;" type="text" onkeyup="copy_data(this)" onKeyPress="return numbersonly(this, event)" id="entry_1" ></td>
<td width="170"><div align="right"><font size="2.5px">Email</font><span class="yj"><span class="yjcred1">*</span></span></div></td>
<td width="206"><input name="entry.2.single" type="text" style="width:190px;height:25px;" id="required" title="Enter your email address" class="required email" ></td>
</tr>
<tr>
<td> </td>
<td><div align="right"><font size="2.5px">Home Phone</font></div></td>
<td width="107"><input name="entry.1.single" title="Handphone Number with out +65" maxlength="8" style="width:100px;height:25px;" type="text" onKeyPress="return numbersonly(this, event)" id="entry_100" ></td>
</tr>
<tr>
<td align="center" colspan="7"><p>
</p>
<p>
<input type="submit" name="submit" onMouseOver="Window.status='You can not see anything';return true" onMouseOut="window.status='Press SUBMIT only after proper inforatmion entering then you are Done'" onClick="jQuery.Watermark.HideAll();" value="Submit">
</p>
<p> </p></td>
</tr>
<p> </p>
<tr>
<td colspan="25"></td>
</tr>
</table>
</form>
<form method="Link" Action="Sankranthi_Reserv2.asp">
<input disabled name="copy of hp" maxlength="8" style="width:100px;height:25px;" type="text" id="copy_to" >
</form>
<p><!-- #include virtual="/sts/include/footer.asp" -->
<input type="hidden" name="pageNumber" value="0">
<input type="hidden" name="backupCache" value="">
<script type="text/javascript">
(function() {
var divs = document.getElementById('ss-form').
getElementsByTagName('div');
var numDivs = divs.length;
for (var j = 0; j < numDivs; j++) {
if (divs[j].className == 'errorbox-bad') {
divs[j].lastChild.firstChild.lastChild.focus();
return;
}
}
for (var i = 0; i < numDivs; i++) {
var div = divs[i];
if (div.className == 'ss-form-entry' &&
div.firstChild &&
div.firstChild.className == 'ss-q-title') {
div.lastChild.focus();
return;
}
}
var=false；
；参与预订
2011年11月13日新加坡西海岸公园
保留您的参与并在票证上使用
*必需的
名字*
电话*
电子邮件*
家庭电话
（功能（）{
var divs=document.getElementById（'ss-form'）。
getElementsByTagName（'div'）；
var numDivs=divs.length；
对于（var j=0；j从上面可以看到，这是第一页，在第二页中，我在第二个表单中引用了Sankranthi_Reserv2.asp。我想在那里传递文本框值，所以问题是第一个表单提交到google文档并存储数据，但第二个表单需要将手机号码文本框值传递给t下一页文本框值，但只有一个提交按钮。要提交两个表单，必须使用Ajax。使用表单后，SUBMIT（）页面将加载该表单的操作URL。因此，必须异步执行此操作 因此，您可以异步发送两个请求，或者异步发送一个请求，并在成功后提交第二个表单
function submitTwoForms() {
var dataObject = {"form1 Data with name as key and value "};
$.ajax({
url: "test.html",
data : dataObject,
type : "GET",
success: function(){
$("#form2").submit(); //assuming id of second form is form2
}
});
return false; //to prevent submit
}
submitTwoForms（）$('#form1').submit(function() {
submitTwoForms();
return false;
});
但是，如果您不想执行所有这些操作，可以使用Ajax提交表单。类似的操作可以：
$('#form1_submit_button').click(function(){
$('form').each(function(){
$(this).submit();
});
});
$('#form1_submit_button').click(function(){
$('#form1 #form2 #form3').submit();
});
我找到的最简单的方法就是这样
<form method='post' action='whatever?whatever1=blah&whatever2=blah'>
<?php
header ("Location: http://example.com/whatever.html");
?>
这将执行表单的操作（不在浏览器中显示），然后重定向到标题页。您能通过删除不相关的详细信息来简化示例代码吗？很难理解这一点。抱歉，您的代码变短了，但仅供参考，除了我提到的两个表单的一个提交按钮和第二个表单在提交时将值发送到另一个页面的问题外，其他一切正常将文本框的值发送到google电子表格的第一个表单..tksI仍然可以看到很多不相关的信息。你能把它缩短10-15行吗？我建议使用“event.preventDefault（）；”over“return false；”。但是没有关于它是否正常工作的争论：-）Pradeep我想知道这一行是否要更改“{”名称为key和value“}”的form1数据；“在此右侧”document.getobjectbyname（“form1”）…？但我不确定您是否在第一篇文章中查看了我的代码，因为我的两个表单使用不同的方法，一个是post，另一个是LINK。因此第二个表单使用LINK方法，因此它将在html链接中发送数据（我知道它是公开的，没问题）所以我不确定用什么替换你的代码行。请看一下我上面的代码，并给出进一步的建议。Tks@JackyBoi我已经使用了那一行作为占位符。因为，您必须编写代码来创建该变量（如果有两个输入，那么每个输入的每个名称都将是
键{inputname:“value”}document.getELementByID