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表单脚本，但我一直无法让它正常工作。但我确实已经加载了该库（文件）。

来源

2009-08-02 mrpatg

此代码应该这样做。你并不需要如此简单的东西表单插件：

$('#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 
});

来源

2009-08-02 05:54:01

如果您不希望页面被刷新，您必须使用AJAX发布表单。

来源

2009-08-02 05:53:41 RaYell

接住一个提交按钮的点击事件不是赶上了形式适当事件提交。你想抓住表单的提交事件。 – 2009-08-02 05:54:37

你当然是对的。更新我的代码。 – RaYell 2009-08-02 05:56:36

这工作也进行文件上传

$(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"); 

     } 
    });   

});

来源

2015-02-03 22:02:20

jquery提交表单，然后在现有div中显示结果

回答

相关问题