這個AJAX表單爲什麼不行？

無論我做什麼，這個表格都不會通過AJAX表現出來。有4個（在這種情況下是3個）不同的按鈕，用戶單擊以選擇一個大小，並在表單處理中使用此按鈕的值。它也將優雅降級（當它的工作原理）與#is_ajax隱藏字段..這個AJAX表單爲什麼不行？

HTML：

<form action="../bin/func/actions/add.action.php" method="post" id="addToCart"> 
     <input type="hidden" name="is_ajax" value="false" id="is_ajax"> 
     <input type="hidden" name="action" value="add"> 
     <button class="add-size" value="S">S</button> 
     <span class="no-stock">M</span> 
     <button class="add-size" value="L">L</button> 
     <button class="add-size" value="XL">XL</button> 
    </form> 
      <div id="cart-success"></div>

的jQuery：

$(function() { 
$(".add-size").click(function() { 
    // first off set hidden variable to TRUE so we know AJAX is playing ball 
    $("#is_ajax").val(true); 

    // serialise the form data 
    var dataString = 'size=' + $(this).val() + '&is_ajax=' + $("#is_ajax").val(); 

    // slide down the small cart 
    $("#cart-expand").slideDown(200); 
    $("#cart-thumb a").toggle(); 

    // let's do this.. 
    $.ajax({ 
     type: "POST", 
     url: "../bin/func/actions/add.action.php", 
     dataType: 'html', 
     data: dataString, 
     success: function(data){ 
     $("#cart-success").html(data);   
     return false; 
     } 
    }); 
}); 
});

PHP（振作起來）

<?php 
if($_POST['is_ajax'] == 'true') 
    echo 'true'; 
else 
    echo 'false'; 
?>

無論我做什麼默認表單動作似乎總是踢，並且頁面直接重定向到PHP頁面。如果我刪除了$ .ajax（）部分，那麼剩下的部分就可以工作，看起來有些問題。

另外我不認爲這是因爲我沒有做$（「＃form-ID」）。submit（）...因爲我試過這種更傳統的方式，它仍然不起作用。如果我把

alert(dataString); 
return false;

我創造一切的行爲，因爲它應該在datastring後，只有後，我們得到的AJAX位，這一切都錯了，它似乎輟學的jQuery的，只是做普通帖子提交到HTML中的地址。

幫助！謝謝。

來源

2011-05-12 artparks

return false;

你試圖return false喲你從ajax回調中點擊函數。此返回語句不會返回到您的點擊功能。

您需要return false;在您的ajax語句的末尾。

$.ajax({ 
    ... 
    success: function() { 
    $("#cart-success").html(data); 
    } 
}); 
return false;

由於使用

$(obj).click(function(event) { // <- event param 
    ... 
    event.preventDefault(); 
});

會更好，指出了@ClementHerreman。

來源

2011-05-12 13:29:25 Raynos

bish bash bosh你是英雄。當它讓我愛你時，會給你一些愛。 – artparks 2011-05-12 13:32:58

是不是'event.preventDefault（）'更好的方式來防止，以及默認行爲？ – 2011-05-12 13:37:44

@ClementHerreman是的。 – Raynos 2011-05-12 13:38:58

嘗試改變這種

$("#is_ajax").val('true');

編輯：

的true Istead和false嘗試0和1

來源

2011-05-12 13:28:53 jimy

不幸的是，雖然可能更明智 – artparks 2011-05-12 13:30:49

查看編輯答案 – jimy 2011-05-12 13:34:02

您需要調用event.stopPropagation（）

http://api.jquery.com/event.stopPropagation/

來源

2011-05-12 13:31:36

沒有真正回答您的具體問題，但如果你想知道，如果一個形式使用AJAX提交的，你可以看看HTTP請求標頭。

實施例：

if ($_SERVER['HTTP_X_REQUESTED_WITH'] == 'XMLHttpRequest') 
{ 
    //submitted via AJAX 
} 
else 
{ 
    //not submitted via AJAX 
}

注意，這不是一個100％準確的猜測。有關更多解釋，請參見Does $_SERVER['HTTP_X_REQUESTED_WITH'] exist in PHP or not?。

來源

2011-05-12 13:36:18

這個AJAX表單爲什麼不行？

回答

相關問題