jquery提交表单,然后在现有div中显示结果
问题描述:
我有一个简单的一个文本输入表单,当提交时,需要获取一个php文件(将输入传递给文件),然后将结果(只是一行文本)并将其放在div
中,并将div
淡入视图中。jquery提交表单,然后在现有div中显示结果
这是我现在有:
<form id=create method=POST action=create.php>
<input type=text name=url>
<input type="submit" value="Create" />
<div id=created></div>
我需要的是create.php?url=INPUT
结果,可以动态加载到div
称为created
。
我有jquery表单脚本,但我一直无法让它正常工作。但我确实已经加载了该库(文件)。
答
此代码应该这样做。你并不需要如此简单的东西表单插件:
$('#create').submit(function() { // catch the form's submit event
$.ajax({ // create an AJAX call...
data: $(this).serialize(), // get the form data
type: $(this).attr('method'), // GET or POST
url: $(this).attr('action'), // the file to call
success: function(response) { // on success..
$('#created').html(response); // update the DIV
}
});
return false; // cancel original event to prevent form submitting
});
答
如果您不希望页面被刷新,您必须使用AJAX发布表单。
答
这工作也进行文件上传
$(document).on("submit", "form", function(event)
{
event.preventDefault();
var url=$(this).attr("action");
$.ajax({
url: url,
type: 'POST',
dataType: "JSON",
data: new FormData(this),
processData: false,
contentType: false,
success: function (data, status)
{
$('#created').html(data); //content loads here
},
error: function (xhr, desc, err)
{
console.log("error");
}
});
});
接住一个提交按钮的点击事件不是赶上了形式适当事件提交。你想抓住表单的提交事件。 – 2009-08-02 05:54:37
你当然是对的。更新我的代码。 – RaYell 2009-08-02 05:56:36