提交表单不刷新 - 实际上提交

我想提交表单并加载基于AJAX和PHP中的表单提交数据。我想在不重新加载页面的情况下完成此操作。提交表单不刷新 - 实际上提交

HTML/PHP

<form method="POST"> 
    <button type="submit" name="image1"> 
    <button type="submit" name="image2"> 
    <button type="submit" name="image3"> 
    <button type="submit" name="image4"> 
</form> 

<div> 
// content gets loaded into here 
</div>

jQuery的

$("form").submit(function(event) { 
    event.preventDefault(); 
    $("div").load("content-load.php"); 
}

内容load.php

$validInputs = array('image1', 'image2', 'image3', 'image4'); 

foreach ($validInputs as $v) { 
    if(isset($_POST[$v])){ 
    // load content associated with image1, or image2, etc, into Div 
    } 
}

是的，“event.pr eventDefault（）“是防止页面刷新的一个很好的解决方案。但它实际上并没有提交表单！我需要提交表单，因为我加载到Div的内容取决于“$ _POST [$ v]”的设置。根据用户是否点击第一个，第二个，第三个或第四个提交按钮，content-load.php将遍历$ validInputs并确定按下哪个按钮。根据点击哪个按钮，特定内容将被加载。

如果我使用ajax并防止默认，上述将永远不会运行，因为表单被阻止提交。 PHP需要遍历数组并确定哪个按钮被按下 - 但没有按钮被按下，因为event.preventDefault！我如何让PHP检测哪个按钮被“设置”而不使用页面刷新？

来源

2015-07-20 Jay

为了提交你需要使用jQuery的'阿贾克斯（）'或'。员额（）'函数的形式。 '.load（）'是AJAX的一个弱版本，主要用作向服务器返回一些信息的请求。 [这里有一些基本知识。]（http://jayblanchard.net/basics_of_jquery_ajax.html）另外，你可能想看看HTML中的一些基本表单设置。多次提交，就像你一样，并不是特别有效。 –

当您在event.preventDefault();内部处理程序中取消表单提交操作。如果要提交没有页面刷新的表单，更好的方法是使用$.ajax和$("div").load("content-load.php");应该成功回调。

来源

2015-07-20 20:03:12 abs

这实际上会提交表单吗？我以为.load只是$ .ajax的一个“缩小”版本。 – Jay

不，这不会提交表单。您可以使用$ .ajax发出必要参数的发布请求。因为我们提交表单页面刷新的那一刻必然会发生，除非你使用一些黑客办法来阻止那些带有隐藏iframe的表单目标属性，然后这些信息会使事情变得复杂 – abs

如果您使用的是Jquery，那么$ .post是您的朋友。

例子：

$.post("ajax/test.html", function(data) { 
$(".result").html(data); 
});

延伸阅读：http://api.jquery.com/jquery.post/

来源

2015-07-20 20:32:34

提交表单不刷新 - 实际上提交

回答

相关问题