San*_*kak 76 javascript forms jquery submit
有没有办法在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>
Run Code Online (Sandbox Code Playgroud)
这是应该工作还是有不同的方法来做到这一点?
Pur*_*rag 97
您的代码有两个问题.第一个是你包含$(document).ready();
但没有包装用它创建元素的jQuery对象.
第二个是你正在使用的方法.当选择器(或通常放置选择器的位置)替换为您要创建的元素时,jQuery将创建任何元素.然后你只需将它附加到身体并提交它.
$(document).ready(function(){
$('<form action="form2.html"></form>').appendTo('body').submit();
});
Run Code Online (Sandbox Code Playgroud)
这是代码的实际应用.在这个例子中,它不会自动提交,只是为了证明它会添加表单元素.
这是自动提交的代码.它运作得很好.Jsfiddle带你到404页面,因为显然它的服务器上不存在"form2.html".
Tad*_*eck 93
对的,这是可能的.其中一个解决方案如下(jsfiddle作为证据).
HTML:
<a id="fire" href="#" title="submit form">Submit form</a>
Run Code Online (Sandbox Code Playgroud)
(见上面没有表格)
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();
});
Run Code Online (Sandbox Code Playgroud)
上面的示例向您展示了如何创建表单,如何添加输入以及如何提交.有时显示结果是禁止的X-Frame-Options
,所以我设置target
为_top
,它取代了主窗口的内容.或者,如果您设置_blank
,它可以在新窗口/选项卡中显示.
小智 23
它的My版本没有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();
}
Run Code Online (Sandbox Code Playgroud)
用法:
post_to_url('fullurlpath', {
field1:'value1',
field2:'value2'
}, 'post');
Run Code Online (Sandbox Code Playgroud)
小智 12
像Purmou一样,但提交时删除表单就完成了.
$(function() {
$('<form action="form2.html"></form>').appendTo('body').submit().remove();
});
Run Code Online (Sandbox Code Playgroud)
是的,你刚忘了引号......
$('<form/>').attr('action','form2.html').submit();
Run Code Online (Sandbox Code Playgroud)
小智 7
Josepmra示例适用于我需要的东西.但我不得不添加这条线
form.appendTo( document.body )
Run Code Online (Sandbox Code Playgroud)
它的工作原理.
var form = $(document.createElement('form'));
$(form).attr("action", "reserves.php");
$(form).attr("method", "POST");
var input = $("<input>")
.attr("type", "hidden")
.attr("name", "mydata")
.val("bla" );
$(form).append($(input));
form.appendTo( document.body )
$(form).submit();
Run Code Online (Sandbox Code Playgroud)
尝试使用此代码 -
这是一个完全动态的解决方案:
var form = $(document.createElement('form'));
$(form).attr("action", "reserves.php");
$(form).attr("method", "POST");
var input = $("<input>").attr("type", "hidden").attr("name", "mydata").val("bla");
$(form).append($(input));
$(form).submit();
Run Code Online (Sandbox Code Playgroud)
归档时间: |
|
查看次数: |
132844 次 |
最近记录: |