用Javascript同時提交多個Web表單的方法
更新時間:2009年12月26日 02:19:50 作者:
使用Javascript同時提交多個Web表單的方法
1問題來自一位網(wǎng)友的提問:
web頁面里有多個表單,每個表單對應著某一類數(shù)據(jù)操作。
比如一個詳細的簡歷信息頁面分
1、個人資料
2、工作經(jīng)驗
3、項目經(jīng)驗
4、其他信息 4個表單。
一般的需求是允許用戶單獨提交其中任何一個表單到下一個頁面進行修改操作(也就是說頁面有4個不同的修改按鈕,點擊哪個按鈕則只提交某一個表單的數(shù)據(jù)到服務器,并根據(jù)表單的action)。
現(xiàn)在有這樣的需求,允許用戶選擇其中任意的一個或多個表單進行提交修改,這樣的話在客戶端如何提交表單?
聲明:可能會有人說將4個表單合成一個大表單,根據(jù)修改按鈕的不同在服務器端進行不同的數(shù)據(jù)操作即可。這是一種解決辦法,但考慮到頁面數(shù)據(jù)量比較大,為了提高效率,減少數(shù)據(jù)傳輸量,還是希望能夠分成多個表單提交,所以這個辦法暫不考慮。是不是一定要用js或ajax?如果不用呢?
2 個人觀點
1 用Ajax提交,比如prototype
new Ajax.Request("/do1",{parameters:$("form1").serialize().......);
new Ajax.Request("/do2",{parameters:$("form2").serialize().......);
你可以同時調(diào)用多個,默認是異步提交,所以可以同時提交多個表單,這個方案是最簡單的。
2 使用多個iframe,然后將每個表單的target指向不同的iframe
然后用js的
document.getElementById("form1").submit();
document.getElementById("form2").submit();
。。。
這個樣子進行提交。
3 兩個方法的對比
Ajax方便簡單,對結(jié)果的處理也比較省事,框架都替我們做好了,但不能跨域提交
iframe最符合一般的使用,也可以跨域提交,處理返回結(jié)果稍微麻煩些,需要在iframe里面使用 parent.進行調(diào)用才可以。
web頁面里有多個表單,每個表單對應著某一類數(shù)據(jù)操作。
比如一個詳細的簡歷信息頁面分
1、個人資料
2、工作經(jīng)驗
3、項目經(jīng)驗
4、其他信息 4個表單。
一般的需求是允許用戶單獨提交其中任何一個表單到下一個頁面進行修改操作(也就是說頁面有4個不同的修改按鈕,點擊哪個按鈕則只提交某一個表單的數(shù)據(jù)到服務器,并根據(jù)表單的action)。
現(xiàn)在有這樣的需求,允許用戶選擇其中任意的一個或多個表單進行提交修改,這樣的話在客戶端如何提交表單?
聲明:可能會有人說將4個表單合成一個大表單,根據(jù)修改按鈕的不同在服務器端進行不同的數(shù)據(jù)操作即可。這是一種解決辦法,但考慮到頁面數(shù)據(jù)量比較大,為了提高效率,減少數(shù)據(jù)傳輸量,還是希望能夠分成多個表單提交,所以這個辦法暫不考慮。是不是一定要用js或ajax?如果不用呢?
2 個人觀點
1 用Ajax提交,比如prototype
new Ajax.Request("/do1",{parameters:$("form1").serialize().......);
new Ajax.Request("/do2",{parameters:$("form2").serialize().......);
你可以同時調(diào)用多個,默認是異步提交,所以可以同時提交多個表單,這個方案是最簡單的。
2 使用多個iframe,然后將每個表單的target指向不同的iframe
然后用js的
document.getElementById("form1").submit();
document.getElementById("form2").submit();
。。。
這個樣子進行提交。
3 兩個方法的對比
Ajax方便簡單,對結(jié)果的處理也比較省事,框架都替我們做好了,但不能跨域提交
iframe最符合一般的使用,也可以跨域提交,處理返回結(jié)果稍微麻煩些,需要在iframe里面使用 parent.進行調(diào)用才可以。
相關文章
Javascript 生成指定范圍數(shù)值隨機數(shù)
查手冊后才知道, 介紹的信息少得可憐吶, 沒有介紹生成 m-n 范圍的隨機數(shù)..., 就只是給你一個 Math.random() 了事.2009-01-01
ts依賴引入報錯:無法找到模塊“xxxxxx”的聲明文件問題解決
這篇文章主要給大家介紹了關于ts依賴引入報錯:無法找到模塊“xxxxxx”的聲明文件問題的解決辦法,文中通過示例帶將解決辦法介紹的非常詳細,需要的朋友可以參考下2023-07-07
HTML5+Canvas調(diào)用手機拍照功能實現(xiàn)圖片上傳(下)
這篇文章主要為大家詳細介紹了HTML5+Canvas調(diào)用手機拍照功能實現(xiàn)圖片上傳,具有一定的參考價值,感興趣的小伙伴們可以參考一下2017-04-04
一直都需要的復制到系統(tǒng)剪貼板之IE,firefox兼容版
一直都需要的復制到系統(tǒng)剪貼板之IE,firefox兼容版...2007-09-09

