提交表單不刷新 - 實際上提交

我想提交表單並加載基於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

提交表單不刷新 - 實際上提交

回答

相關問題