用JS提交參數(shù)創(chuàng)建form表單在FireFox中遇到的問(wèn)題
更新時(shí)間：2013年01月16日 16:25:29 作者：
在一個(gè)前端頁(yè)面上，需要通過(guò)JavaScript來(lái)提交參數(shù)，使用JS創(chuàng)建form表單，將參數(shù)append到表單中進(jìn)行提交,接下來(lái)將介紹如何操作與實(shí)現(xiàn)
在一個(gè)前端頁(yè)面上，需要通過(guò)JavaScript來(lái)提交參數(shù)，使用JS創(chuàng)建form表單，將參數(shù)append到表單中進(jìn)行提交，代碼如下：
Js代碼:
functionloadConfig(gameUrl,skinId){
vartemp=document.createElement("form");
temp.action="${createLink(controller:'mobileConfig',action:'beforeLaunchConfig')}";
temp.method="POST";
temp.style.visibility="hidden";
varopt=document.createElement("input");
opt.name="gameUrl";
opt.id="gameUrl";
opt.value=gameUrl;
varopt2=document.createElement("input");
opt2.name="skinId";
opt2.id="skinId";
opt2.value=skinId;
temp.appendChild(opt);
temp.appendChild(opt2);
temp.submit();
}
該功能在Chrome及Safari上都能成功運(yùn)行，但在使用FireFox（17.0.1）時(shí)不能成功提交，經(jīng)過(guò)研究發(fā)現(xiàn)，F(xiàn)ireFox在提交頁(yè)面表單時(shí)要求頁(yè)面有完整的標(biāo)簽項(xiàng)，即<html><head><title></title></head><body><form></form</body</html>這樣的標(biāo)簽結(jié)構(gòu)。因此，將該段JS做了寫小改動(dòng)：
Js代碼:
functionloadConfig(gameUrl,skinId){
varpageDiv=document.getElementById("page");
vartemp=document.createElement("form");
temp.action="${createLink(controller:'mobileConfig',action:'beforeLaunchConfig')}";
temp.method="POST";
temp.style.visibility="hidden";
temp.name="loadConfigPage";
varopt=document.createElement("input");
opt.name="gameUrl";
opt.id="gameUrl";
opt.value=gameUrl;
varopt2=document.createElement("input");
opt2.name="skinId";
opt2.id="skinId";
opt2.value=skinId;
temp.appendChild(opt);
temp.appendChild(opt2);
pageDiv.appendChild(temp);
temp.submit();
}
在<body>標(biāo)簽內(nèi)append此處創(chuàng)建的form表單，再進(jìn)行提交就能成功了。
Js代碼:
復(fù)制代碼 代碼如下:
functionloadConfig(gameUrl,skinId){
vartemp=document.createElement("form");
temp.action="${createLink(controller:'mobileConfig',action:'beforeLaunchConfig')}";
temp.method="POST";
temp.style.visibility="hidden";
varopt=document.createElement("input");
opt.name="gameUrl";
opt.id="gameUrl";
opt.value=gameUrl;
varopt2=document.createElement("input");
opt2.name="skinId";
opt2.id="skinId";
opt2.value=skinId;
temp.appendChild(opt);
temp.appendChild(opt2);
temp.submit();
}
該功能在Chrome及Safari上都能成功運(yùn)行，但在使用FireFox（17.0.1）時(shí)不能成功提交，經(jīng)過(guò)研究發(fā)現(xiàn)，F(xiàn)ireFox在提交頁(yè)面表單時(shí)要求頁(yè)面有完整的標(biāo)簽項(xiàng)，即<html><head><title></title></head><body><form></form</body</html>這樣的標(biāo)簽結(jié)構(gòu)。因此，將該段JS做了寫小改動(dòng)：
Js代碼:
復(fù)制代碼 代碼如下:
functionloadConfig(gameUrl,skinId){
varpageDiv=document.getElementById("page");
vartemp=document.createElement("form");
temp.action="${createLink(controller:'mobileConfig',action:'beforeLaunchConfig')}";
temp.method="POST";
temp.style.visibility="hidden";
temp.name="loadConfigPage";
varopt=document.createElement("input");
opt.name="gameUrl";
opt.id="gameUrl";
opt.value=gameUrl;
varopt2=document.createElement("input");
opt2.name="skinId";
opt2.id="skinId";
opt2.value=skinId;
temp.appendChild(opt);
temp.appendChild(opt2);
pageDiv.appendChild(temp);
temp.submit();
}
在<body>標(biāo)簽內(nèi)append此處創(chuàng)建的form表單，再進(jìn)行提交就能成功了。
相關(guān)文章
概述一個(gè)頁(yè)面從輸入U(xiǎn)RL到頁(yè)面加載完的過(guò)程
本文主要對(duì)一個(gè)頁(yè)面從輸入 URL 到頁(yè)面加載完的過(guò)程中都發(fā)生了什么事情進(jìn)行概述，對(duì)我們學(xué)習(xí)網(wǎng)絡(luò)語(yǔ)言有一定的幫助，下面就跟小編一起來(lái)看下吧2016-12-12
使用bootstrap typeahead插件實(shí)現(xiàn)輸入框自動(dòng)補(bǔ)全之問(wèn)題及解決辦法
這篇文章主要介紹了使用bootstrap typeahead插件實(shí)現(xiàn)輸入框自動(dòng)補(bǔ)全之問(wèn)題及解決辦法的相關(guān)資料,非常不錯(cuò)，具有參考借鑒價(jià)值，需要的朋友可以參考下2016-07-07
UUID是一種由算法生成的二進(jìn)制長(zhǎng)度為128位的數(shù)字標(biāo)識(shí)符，格式為“xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx”。本文總結(jié)了五個(gè)JS生成UUID的方法，感興趣的可以了解一下2022-06-06
在本篇文章里我們給大家分享了關(guān)于JS中pop使用方法的實(shí)例內(nèi)容，有興趣的朋友們學(xué)習(xí)下。2019-01-01
本文主要介紹了JavaScript的數(shù)組操作，具有很好的參考價(jià)值，下面跟著小編一起來(lái)看下吧2017-02-02
javascript實(shí)現(xiàn)倒計(jì)時(shí)小案例
這篇文章主要為大家詳細(xì)介紹了javascript實(shí)現(xiàn)倒計(jì)時(shí)小案例，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2022-07-07
js正則表達(dá)式驗(yàn)證密碼強(qiáng)度【推薦】
本文主要介紹了js利用正則表達(dá)式驗(yàn)證密碼強(qiáng)度的實(shí)例，具有很好的參考價(jià)值。下面跟著小編一起來(lái)看下吧2017-03-03
JS實(shí)現(xiàn)新浪博客左側(cè)的Blog管理菜單效果代碼
這篇文章主要介紹了JS實(shí)現(xiàn)新浪博客左側(cè)的Blog管理菜單效果代碼,可實(shí)現(xiàn)基于鼠標(biāo)點(diǎn)擊事件動(dòng)態(tài)操作頁(yè)面元素樣式的功能,界面美觀大方,簡(jiǎn)潔實(shí)用,需要的朋友可以參考下2015-10-10
關(guān)于數(shù)據(jù)與后端進(jìn)行交流匹配(點(diǎn)亮星星)
這篇文章主要介紹了關(guān)于數(shù)據(jù)與后端進(jìn)行交流匹配(點(diǎn)亮星星) 的相關(guān)資料,非常不錯(cuò)，具有參考借鑒價(jià)值，需要的朋友可以參考下2016-08-08
JavaScript實(shí)現(xiàn)設(shè)計(jì)模式中的單例模式的一些技巧總結(jié)
單例模式是JavaScript項(xiàng)目中最常用的設(shè)計(jì)模式之一,下面羅列了JavaScript實(shí)現(xiàn)設(shè)計(jì)模式中的單例模式的一些技巧總結(jié),包括惰性加載與分支技術(shù)等,需要的朋友可以參考下.2016-05-05