动态创建和提交表单
动态创建和提交表单
提问于 2011-11-04 07:10:59
在jQuery中有没有办法动态地创建和提交表单？
类似于下面的内容。
<html>
<head>
<title> Title Text Goes Here </title>
<script src="http://code.jquery.com/jquery-1.7.js"></script>
<script>
$(document).ready(function(){alert('hi')});
$('<form/>').attr('action','form2.html').submit();
</script>
</head>
<body>
Content Area
</body>
</html>这是应该起作用的，还是有不同的方法来做到这一点？
回答 10
Stack Overflow用户
回答已采纳
发布于 2011-11-04 07:22:11
你的代码有两个地方有问题。第一个问题是您包含了$(document).ready();，但没有包装使用它创建元素的jQuery对象。
第二个是你使用的方法。当选择器(或通常放置选择器的位置)被替换为您想要创建的元素时，jQuery将创建任何元素。然后您只需将其附加到正文并提交即可。
$(document).ready(function(){
$('<form action="form2.html"></form>').appendTo('body').submit();
});Here's运行中的代码。在本例中，它不会自动提交，只是为了证明它会添加表单元素。
使用Here's自动提交代码。它工作得很好。Jsfiddle会将您带到一个404页面，因为"form2.html“显然不存在于它的服务器上。
Stack Overflow用户
发布于 2011-11-04 07:23:42
是的，这是可能的。其中一个解决方案如下(jsfiddle as a proof)。
HTML：
<a id="fire" href="#" title="submit form">Submit form</a>(请看，上面没有表单)
JavaScript：
jQuery('#fire').click(function(event){
event.preventDefault();
var newForm = jQuery('<form>', {
'action': 'http://www.google.com/search',
'target': '_top'
}).append(jQuery('<input>', {
'name': 'q',
'value': 'stack overflow',
'type': 'hidden'
}));
newForm.submit();
});上面的例子展示了如何创建表单，如何添加输入和如何提交。有时X-Frame-Options禁止显示结果，所以我将target设置为_top，它将替换主窗口的内容。或者，如果您设置了_blank，它可以显示在新的窗口/选项卡中。
Stack Overflow用户
发布于 2017-04-26 00:34:36
这是我的没有jQuery的版本，简单的函数可以在飞行中使用
功能：
function post_to_url(path, params, method) {
method = method || "post";
var form = document.createElement("form");
form.setAttribute("method", method);
form.setAttribute("action", path);
for(var key in params) {
if(params.hasOwnProperty(key)) {
var hiddenField = document.createElement("input");
hiddenField.setAttribute("type", "hidden");
hiddenField.setAttribute("name", key);
hiddenField.setAttribute("value", params[key]);
form.appendChild(hiddenField);
}
}
document.body.appendChild(form);
form.submit();
}用法：
post_to_url('fullurlpath', {
field1:'value1',
field2:'value2'
}, 'post');页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/8003089
复制相关文章
相似问题
腾讯云开发者
