1. 程式人生 > >實現同時提交多個form(基礎方法) 收集

實現同時提交多個form(基礎方法) 收集

Js程式碼 <script language="javascript">   
  1. //點選提交按鈕觸發下面的函式 
  2. function submitit(){   
  3. //第一個表單 
  4. var tform1= document.getElementById("formid1");   
  5. //第二個表單 
  6. var tform2= document.getElementById("formid2");   
  7. //提交第一個表單 
  8.   tform1.submit();   
  9. //提交第二個表單 
  10.   tform2.submit();   
  11. }   
  12. </script>   
  13. <!--  第一個表單,方法為post,會觸發後臺的login.
    do對應的servlet ,提交到_hiddenframe1裡了,即login.do返回的結果會隱藏在_hiddenframe1中-->   
  14. <form name="form1" id="formid1" action="login.do" method="post"  target="_hiddenframe1">   
  15.     <input type="text" name="tname" value="張三">   
  16.     <input type="button" name="tsub" value="提交" onClick="javascript:submitit();"
    >   
  17. </form>   
  18. <!--  第二個表單,方法為post,會觸發後臺的sms.do對應的servlet ,提交到_hiddenframe2裡了,即sms.do返回的結果會隱藏在_hiddenframe2中.其中通過style="display:none;"進行了隱藏。 -->   
  19. <form name="from2" id="formid2" action="sms.do" method="post" style="display:none;"  target="_hiddenframe2">   
  20.     <input type=
    "text" name="tname" value="王五">   
  21. </form>   
  22. <!-- 加入了style="display:none;"用於隱藏 -->   
  23. <iframe name="_hiddenframe1" style="display:none;"></iframe>   
  24. <iframe name="_hiddenframe2"></iframe>  
  1. <script language="javascript">  
  2. //點選提交按鈕觸發下面的函式
  3. function submitit(){  
  4. //第一個表單
  5.    var tform1= document.getElementById("formid1");  
  6. //第二個表單
  7.    var tform2= document.getElementById("formid2");  
  8. //提交第一個表單
  9.   tform1.submit();  
  10. //提交第二個表單
  11.   tform2.submit();  
  12. }  
  13. </script>  
  14. <!--  第一個表單,方法為post,會觸發後臺的login.do對應的servlet ,提交到_hiddenframe1裡了,即login.do返回的結果會隱藏在_hiddenframe1中-->  
  15. <form name="form1" id="formid1" action="login.do" method="post"  target="_hiddenframe1">  
  16.     <input type="text" name="tname" value="張三">  
  17.     <input type="button" name="tsub" value="提交" onClick="javascript:submitit();">  
  18. </form>  
  19. <!--  第二個表單,方法為post,會觸發後臺的sms.do對應的servlet ,提交到_hiddenframe2裡了,即sms.do返回的結果會隱藏在_hiddenframe2中.其中通過style="display:none;"進行了隱藏。 -->  
  20. <form name="from2" id="formid2" action="sms.do" method="post" style="display:none;"  target="_hiddenframe2">  
  21.     <input type="text" name="tname" value="王五">  
  22. </form>  
  23. <!-- 加入了style="display:none;"用於隱藏 -->  
  24. <iframe name="_hiddenframe1" style="display:none;"></iframe>  
  25. <iframe name="_hiddenframe2"></iframe>  

除上面原始的方法外,目前的ajax技術就能很方便的實現多個表單提交。可以使用目前廣泛被使用的jQuery框架。

一個表單form、submit提交到多個不同頁面  

在做管理頁面的時候常常遇到這樣的情況:全選所有列表,然後進行多個操作(刪除、轉移等),這樣每條記錄做一個表單比較麻煩,HTML程式碼太多而且操作複雜。通常會遇到了一個表單提交到不同的處理頁面,比如執行刪除的delete.asp 或者move.asp 。上網找了下資料,大多數方法都是通過Javascipt來實現了以上的功能,程式碼如下。


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">  
<head>   
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />   
<title>一個表單、多個提交按鈕、提交到多個不同頁面</title>   
</head>   
   
<script>   
function sm1(){    
document.getElementById("form_78").action="1.asp";    
document.getElementById("form_78").submit();    
}    
function sm2(){    
document.getElementById("form_78").action="2.asp";    
document.getElementById("form_78").submit();    
}    
</script>   
<form action="" method="post" name="form_78" id="form_78">   
    <input name="mytext" type="text" id="mytext" />   
    <input name="bt1" type="button" id="bt1" value="提交到1.asp" onclick="sm1()" />   
    <input name="bt2" type="button" id="bt2" value="提交到2.asp" onclick="sm2()" />   
</form>   
</body>   
</html>  
=============================================================================

用JS提交吧。

<input type='button' value='aa' onclick="dosubmit('show')" />

<input type='button' value='aa' onclick="dosubmit('js')" />

<script>

function dosubmit(otype){

document.myform.action='123.asp?otype=' + otype;

document.myform.submit();

}

</script>

==================================================================================

JS一個表單提交到多個頁面的方法彙總
作者:bcw52    文章來源:網路    點選數:71    更新時間:2010-12-3

方法一:使用多個button按鈕,為每個按鈕的onclick事件設計一個子過程,通過讀取按鈕的值來判斷向誰提交資料,原始碼如下:
<script language="javascript"> 
function tosubmit1() 

document.submitform1.action="1.asp"; 
document.submitform1.submit(); 
}   
function tosubmit2() 

document.submitform1.action="2.asp"; 
document.submitform1.submit(); 

function tosubmit3() 

document.submitform1.action="3.asp"; 
document.submitform1.submit(); 

</script> 
</head>     
<form name="submitform1" action="" method="post" target="_blank"> 
<input type="button" name="submit1" value="提交給1.asp" onclick="tosubmit1()"> 
<input type="button" name="submit2" value="提交給2.asp" onclick="tosubmit2()">
<input type="button" name="submit3" value="提交給3.asp" onclick="tosubmit3()"> 
</form>
方法二:使用多個button按鈕,定義每個按鈕的onclick事件的處理過程,不需要判斷按鈕的value值,而直接定義form表單的action值,程式碼比較簡單,如下:
<form name="submitform2" action="" method="post" target="_blank">
<input name="submit1" value="提交給1.asp" type="button" onclick="submitform2.action='1.asp';submitform2.submit();">
<input name="submit2" value="提交給1.asp" type="button" onclick="submitform2.action='2.asp';submitform2.submit();">
<input name="submit3" value="提交給1.asp" type="button" onclick="submitform2.action='3.asp';submitform2.submit();">
</form>
方法三:同樣使用多個button按鈕,也同樣為每個按鈕設計一個onclick事件子過程,不同的是使用switch case語句來判斷button按鈕的value值,從而作相應的處理,程式碼如下:
<form name="submitform3" action="" method="post" target="_blank">
<input type="submit" name="submit1" value="提交給1.asp" onclick="dothis(this)">
<input type="submit" name="submit2" value="提交給2.asp" onclick="dothis(this)">
<input type="submit" name="submit3" value="提交給3.asp" onclick="dothis(this)">
</form>
<script language="javascript">
function dothis(obj)
{
switch(obj.value)
{
case "提交給1.asp":
document.submitform3.action="1.asp";
break;
case "提交給2.asp":
document.submitform3.action="2.asp";
break;
case "提交給3.asp":
document.submitform3.action="3.asp";
break;
}
}
</script>