如何使用jQuery變量加載$ _POST數組，使用/不使用html表格

Question

我遇到了$ .ajax（）和$ .post（）調用中的一些問題，用於在接口端向服務器端PHP發送一些變量進行處理。 雖然這似乎是一個微不足道的問題，並在形式上大量報道，但我嘗試了過去幾天的所有選項，但沒有成功。

我的情況如下：

我有畫，使用戶可以在任何位置點擊和二維座標值將通過其工作正常jQuery的功能記錄的4x4網格，一個簡單的界面。現在我需要將這兩個x-y變量發送到PHP，並通過單擊用戶按鈕來存儲在數據庫中。我允許用戶點擊多次，但有一個提交按鈕，以便只提交最終點擊的值。 我都寫在一個文件test.php的工作如下：

<?php 
$x = $_POST['xval']; 
$y = $_POST['yval']; 
echo "X-Value......" . "$x"; 
echo "Y-Value......" . "$y"; 
// Code to store $x and $y in database 
?> 
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script> 
<script type="text/javascript"> 
jQuery(document).ready(function(){ 
var x=0; 
var y=0; 
$("#table").click(function(e1){ 
// Process x, y values from the grid..This part is working fine and tested also 
}) 
$("#form").submit(function(event) { 
    //var $form = $(this); 
    //var url_s = $form.attr('action'); 
    var data_s = {xval: 'x', yval: 'y'}; 
    //$.post("test.php", { xval:"x", yval: y }); 
     $.ajax({ type: "POST", url: "test.php", data: {xval: 'x', yval: 'y'}}); 
}) 
}); 
</script> 
<div class="form"> 
<form name="form100" id="form"> 
<input type="submit" name="SubmitOption" id="button" value="Next"> 
</form> 
</div> 

我張貼在同一頁即test.php的值，因爲我要處理的頂部部分的值PHP代碼，但我無法檢索PHP-end中的$ x，$ y值。 在我測試後有如下形式： 「>

測試後，我發現，$ _ POST是唯一能夠與方法=加載表單變量」後「行動=」但從來沒有使用帶有jQuery變量的$ .post或$ .ajax調用。 我嘗試了一種解決方法，通過從jQuery中單擊函數加載兩個文本區域，然後使用方法=「post」action =「的POST形式，從現在開始，jQuery變量轉換爲表單變量。

如何僅使用表單提交按鈕執行AJAX調用（$ .ajax或$ .post），並通過$ _POST數組將jQuery變量傳遞給服務器PHP，因爲似乎只有$ _POST數組被加載從method =「post」action =「形成變量，不能從$ .post（）和$ .ajax（）調用，並將jQuery變量傳遞給$ _POST數組。 另一個問題將是如何傳遞沒有$ _POST數組中的表單的jQuery變量，只使用一個輸入type =「button」click（用$（「＃button」）試過）click（function（）.... but POST not用$就工作和_POST數組爲空），因爲在技術上我並不需要一個形式，我沒有任何形式的變量？

Answer 1

試試這個

<?php 
if(isset($_POST['action'])){ 
$x = $_POST['xval']; 
$y = $_POST['yval']; 
echo "X-Value......$x"; 
echo "Y-Value......$y"; 
exit; 
} 
?> 

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script> 
<script language="javascript" type="text/javascript"> 

      $(function() { 
      $('#button').click(function(){ 
      $.ajax({ 
      type: 'POST', 
      url : 'test.php', 
      data: { 
      action :'ADD' , 
      xval  :'x', 
      yval  :'y' 
     }, 
     success: function(data) { 
      alert(data); 
      } , 
     error : function(){ 
      alert('erroR'); 
      } 
      }) 
     }) 


$("#table").click(function(e1){ 
// Process x, y values from the grid..This part is working fine and tested also 
}) 


    }) 
</script> 
<div class="form"> 
<input type="submit" name="SubmitOption" id="button" value="Next"> 
</div> 

，並使用Firebug捕獲可能jq- js語法錯誤