Ajax腳本來傳遞變量一個PHP頁面

我是一個關於Ajax的newbye，而且我的第一個腳本有問題。我的意圖是將表單的變量傳遞給一個php頁面，並將結果顯示在同一頁面的div中。Ajax腳本來傳遞變量一個PHP頁面

這裏我的代碼：

<!DOCTYPE html> 
<html> 

<head> 
    <title>Organazier 1.0</title> 
    <meta name="viewport" content="width=device-width, initial-scale=1.0" /> 
    <link href="dist/css/bootstrap.css" rel="stylesheet" /> 
</head> 

<body> 
    <div class="container-fluid"> 
     <div class="row"> 
      <div class="col-xs-6 col-md-4" /> 
      <div class="col-xs-6 col-md-4"> 
       <h1>Test 1.0</h1> 
      </div> 
     </div> 
     <div class="row"> 
      <div class="col-xs-6 col-md-4" /> 
      <div class="col-xs-6 col-md-4"> 
       <form class="MyForm"> 
        <div class="form-group"> 
         <label for="link">link</label> 
         <input type="link" class="form-control" id="link" name="link" value="Value1" /> 
        </div> 
        <div class="form-group"> 
         <label for="Categoria">Categoria</label> 
         <input type="Categoria" class="form-control" id="Categorie" name="Categorie" value="Value2" /> 
        </div> 
        <div class="form-group"> 
         <label for="Titolo">Titolo</label> 
         <input type="Titolo" class="form-control" id="Title" name="Title" value="Value3" /> 
        </div> 
        <button id="newDownload" type="submit" class="btn btn-primary">Download</button> 
       </form> 
      </div> 
     </div> 
     <div class="row"> 
      <div class="col-xs-6 col-md-4" /> 
      <div class="col-xs-6 col-md-4"> 
       <h2>Result:</h2> 
      </div> 
     </div> 
     <div class="row"> 
      <div class="col-xs-6 col-md-4" /> 
      <div class="col-xs-6 col-md-4" name="MyResult" id="MyResult" /> 
     </div> 
    </div> 
    <script src="https://code.jquery.com/jquery.js" /> 
    <script src="dist/js/bootstrap.min.js" /> 
    <script src="dist/js/ajaxform.js" /> 
</body> 

</html>

的ajaxform.js腳本如下：

$(function() { 
//twitter bootstrap script 
    $("button#newDownload").click(function(){ 
      $.ajax({ 
       type: "POST", 
      url: "response_normal.php", 
      data: $('form.MyForm').serialize(), 
       success: function(msg){ 
         $("#MyResult").html(msg) 
       }, 
      error: function(){ 
       alert("failure"); 
       } 
       }); 
    }); 
});

你能幫助我，請找出問題？

非常感謝你， Pazzeo

來源

2014-02-12 user3303852

問題是？ – 2014-02-12 22:59:52

請求是否被執行？查看開發人員工具/螢火蟲上的網絡標籤以查看結果（如果已執行）。在您的ajax/jquery請求中使用異步：「false」（如果爲true，通常會導致請求被取消）。使用developertools/firebug來查看你的js語法（在你的請求或任何其他地方）是否沒有錯誤。正如@Dagon剛剛問到的，請在您的問題中更具體。 – Allende

它是您嘗試自行調試的問題的一個要求，您應該能夠縮小該區域，在混合語言時尤其重要 – 2014-02-12 23:07:01

製作虛假異步Ajax中，它會工作。我在我的服務器上對它進行了測試，以確保它確實是問題所在。

$(function() { 

$("button#newDownload").click(function(){ 
     $.ajax({ 
      type: "POST", 
     url: "response_normal.php", 
     async:false, 
     data: $('form.MyForm').serialize(), 
      success: function(msg){ 
        $("#MyResult").html(msg) 
      }, 
     error: function(){ 
      alert("failure"); 
      } 
      }); 
}); 
});

來源

2014-02-12 23:13:58

以及你的腳本似乎是正確的，我建議：顯示你的.PHP也許錯不在你的腳本，但試試這個：

$(function() { 
//twitter bootstrap script 
$("#newDownload").click(function(){ // Im only change this line 
     $.ajax({ 
      type: "POST", 
      url: "response_normal.php", 
      data: $('form.MyForm').serialize(), 
      success: function(msg){ 
        $("#MyResult").html(msg); // and this the semicolon 
      }, 
      error: function(){ 
       alert("failure"); 
       } 
      }); 
});

}）;

如果您在AJAX是新的我一樣，我建議使用螢火蟲，是一個用於Firefox的擴展，你可以看到發送AJAX，當你想使用提交表單什麼接收PHP和什麼回報PHP

來源

2014-02-12 23:28:52 Quethzel

阿賈克斯，你必須停止形式AJAX using preventDefault() method

防爆之前提交使用默認動作：

$(function() { 
    //twitter bootstrap script 
    $("#newDownload").on('click',function(e){ 
      e.preventDefault(); 
      $.ajax({ 
       type: "POST", 
       url: "response_normal.php", 
       data: $('form.MyForm').serialize(), 
       success: function(msg){ 
         $("#MyResult").html(msg); 
       }, 
       error: function(){ 
         alert("failure"); 
       } 
      }); 
    }); 
});

測試AJAX動作和響應AJAX使用network標籤爲Developer tool for chrome或net tab into firebug with firefox

來源

2014-02-12 23:37:59

Ajax腳本來傳遞變量一個PHP頁面

回答

相關問題