用JS提交参数创建form表单在FireFox中遇到的问题

在一个前端页面上,需要通过JavaScript来提交参数,使用JS创建form表单,将参数append到表单中进行提交,代码如下:
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上都能成功运行,但在使用FireFox(17.0.1)时不能成功提交,经过研究发现,FireFox在提交页面表单时要求页面有完整的标签项,即<html><head><title></title></head><body><form></form</body</html>这样的标签结构。因此,将该段JS做了写小改动:
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>标签内append此处创建的form表单,再进行提交就能成功了。

(0)

相关推荐

  • jquery form表单提交插件asp.net后台中文解码

    在asp.net 后台页面提取时需要解码.解码的方式为:HttpUtility.UrlDecode(context.Request["infostr"].ToString());

  • jsp form表单方法示例

    1.代码: 复制代码 代码如下: <%-- Document : index Created on : 2009-10-4, 13:56:46 Author : lucifer --%> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <title></title> <meta http-equiv=&

  • js 使用form表单select类实现级联菜单效果

    用例如下: 复制代码 代码如下: <form name="form1" method="POST" action="--WEBBOT-SELF--"> <select id="select1" onchange="select1onchange()"> <option value="1">1</option> <option valu

  • jQuery实现form表单reset按钮重置清空表单功能

    有时候可能需要实现这样的效果:使用ajax提交表单,成功提交表单之后清空表单,如下代码: 复制代码 代码如下: <form> <input name="name1" /><br/> <input name="name1" /><br/> <textarea name="content"></textarea> <a href="javascript

  • 没有form表单情况下敲回车键提交表单的js代码

    function enterPress(e) { if (e.keyCode == 13) { login(); } } function login(){ //登录验证等 alert('login'); } Username: Password: [Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]

  • 用JS提交参数创建form表单在FireFox中遇到的问题

    在一个前端页面上,需要通过JavaScript来提交参数,使用JS创建form表单,将参数append到表单中进行提交,代码如下: Js代码: 复制代码 代码如下: functionloadConfig(gameUrl,skinId){ vartemp=document.createElement("form"); temp.action="${createLink(controller:'mobileConfig',action:'beforeLaunchConfig')}

  • JavaScript动态创建form表单并提交的实现方法

    本文实例讲述了JavaScript动态创建form表单并提交的实现方法.分享给大家供大家参考,具体如下: 页面布局有些复杂的情况下,可能需要在页面中动态创建一个 form,JavaScript 创建 form 演示如下: // JavaScript 构建一个 form function MakeForm() { // 创建一个 form var form1 = document.createElement("form"); form1.id = "form1"; f

  • js函数名与form表单元素同名冲突的问题

    今天在导出Excel的时候用了Form 表单的input hidden 来区分导出和搜索.开始的时候js中的onClick事件的函数名 和 hidden 中的 id 命名一样.结果导致报错:调用函数的那一行对象不支持此属性. 找了很长时间都找不出原因,开始的时候一直以为是写错了某个字母,才发现js函数根本没有执行.后来没有办法直接调用了别的函数,发现就有用了,认为是函数名的原因,改了函数名才有用了.然后再将input中的id改成很函数名一样,又出现报错了.在没有下例验证之前,还一直以为是Thin

  • Ajax提交Form表单及文件上传的实例代码

    前几天,发现了一些小问题.我在写后台管理页面时,需要上传一张图片.于是我就用很普通的Form表单上传有一段Json串和图片文件: Form表单上传图片只需要在<form>标签里加上enctype = 'multipart/form-data',这样是可以上传图片的: 但问题来了,在我进行用Form表单提交的时候直接跳出来提交返回值的页面并且原先的页面刷新: 这样我们可以先到异步的Ajax可以实现局部刷新: 废话不多说了 直接上代码: 首先是html: <form id = "f

  • vue+element创建动态的form表单.以及动态生成表格的行和列

    动态创建form表单,网上有插件 (form-create) 不过我不知道它怎么用,没有使用成功,如果你使用成功了,欢迎下方留言. 最后我使用了笨方法,针对各个表单写好通用的组件,然后根据type用v-if来渲染对应的表单,数据,事件什么的都可以动态的传进去,比较好用 复制代码  1 <el-form size="mini" class="lj-form lj-form-s1">  2             <div v-for="(i

  • vue+element创建动态的form表单及动态生成表格的行和列

    动态创建form表单,网上有插件 (form-create) 不过我不知道它怎么用,没有使用成功,如果你使用成功了,欢迎下方留言. 最后我使用了笨方法,针对各个表单写好通用的组件,然后根据type用v-if来渲染对应的表单,数据,事件什么的都可以动态的传进去,比较好用 <el-form size="mini" class="lj-form lj-form-s1"> <div v-for="(item,i) in table.custome

  • js的form表单提交url传参数(包含+等特殊字符)的两种解决方法

    方法一:(伪装form表单提交) linkredwin = function(A,B,C,D,E,F,G){ var formredwin = document.createElement("form"); formredwin.method = 'POST'; document.body.appendChild(formredwin); formredwin.action = "http://www.A.com/A.wiki?A=" +encodeURI(A) +

  • js提交form表单,并传递参数的实现方法

    //增加的函数 begin function queryFun(){ var type = $("#artType").val(); var hasInputed = "1";//表示输入了要搜索 的信息 if($("#query").val()=="选手姓名/编号"){ //表示没有输入要搜索的值 hasInputed="0"; } document.getElementById("queryF

  • 基于jQuery通过jQuery.form.js插件使用ajax提交form表单

    我们在提交表单的时候,如果没有使用ajax提交,页面都会自己刷新一下,显得非常的不友好,所以我们需要把我们的表单提交修改为ajax的模式,可以让用户清楚地知道他们在提交表单的时候处在哪一个阶段:正在提交?提交成功? 我简单使用了一下,jQuery Form插件有一下优点: 1.支持提交前验证. 2.支持提交后回调. 3.采用AJAX方式,有很好的用户体验 4.提交方式是灵活.只要指定要提交的form ID即可.想提交那个form.就可提交那个.同时提交参数可配置. 5.支持提交多种类型数据.如:

  • js实现a标签超链接提交form表单的方法

    本文实例讲述了js实现a标签超链接提交form表单的方法.分享给大家供大家参考.具体实现方法如下: <form action="/home/search" method="get" id="search_form"> <div class="searchBox png" id="searchBox"> <input type="text" id="

随机推荐