Question

我想從我的JavaScript發送變量使用AJAX的PHP文件，但它不工作。我瀏覽了所有類似的問題（有一堆），但還沒有找到解決方案。

這是我的第一個PHP文件（一個表格，將數據發送給JavaScript）：

<option value="imageOne" data-cuteform-image='assets/SketchThumbnails/imageOne.png></option> 
<input id="inputURLID" type="text" name="inputURL"> 

<button type="submit" onclick="handleInputs(document.getElementById('sketch').value, document.getElementById('inputURLID').value); return false;">Submit</button> 

的JavaScript（其中AJAX調用）：

var content = { 
    'sketch': pickedSketch, 
    'songUrl': enteredURL 
}; 
$.ajax({ 
    type: "POST", 
    url: "loadSketch.php", 
    data: content, 
    success: function (data, text) { 
     // alert("success"); 
     // console.log(data); 
     // console.log(text); 

     window.location.href = "loadSketch.php"; 

    }, 
    error: function (request, status, error) { 
     alert(request.responseText); 
    } 
}); 

PHP （loadSketch.php）：

if(isset($_POST['songUrl'])) 
{ 
    $temp = $_POST['songUrl']; 
    echo $temp; 
    echo "received AJAX data"; 
} else { 
    echo "nothing in post variable"; 
} 

當我重定向到loadSketch.php（來自成功的ajax調用）時，「post變量中的任何內容」都被回顯出來。任何想法我做錯了什麼？

任何有識之士都非常感謝！ :)

Answer 1

沒有在songURL中，因爲當您的Ajax函數返回時，它將重定向到您剛剛發佈到的同一頁面。它正在爲該PHP文件創建一個新的HTTP請求，但沒有數據發送給它。刪除控制檯消息上的註釋，您將看到正確的回顯消息。

$.ajax({ 
type: "POST", 
url: "loadSketch.php", 
data: content, 
success: function (data, text) { 
    alert("success"); 
    console.log(data); 

}, 
error: function (request, status, error) { 
    alert(request.responseText); 
} 
}); 

Answer 2

您不應該使用提交按鈕，因爲它會使整個頁面重新加載;而是使用普通按鈕並處理調用AJAX函數的點擊事件。

HTML：

<button onclick="doAjaxFunction(param1, param2);">Calling Ajax Function<button> 

的JavaScript：

function doAjaxFunction(val1,val2){ 
    $.ajax({ 
    type: "POST", 
    url: "loadSketch.php", 
    dataType: "json", 
    data: {"'value1':'"+ val1+"', 'value2':'"+ val2+"'"}, 
    success: function (data, text) { 
    // alert("success"); 
    // console.log(data); 
    // console.log(text); 
    window.location.href = "loadSketch.php"; 
    }, 
    error: function (request, status, error) { 
     alert(request.responseText); 
    } 
}); 

然後隨便挑你的POST參數loadSketch.php並使用它們。

PHP：

$x = $_POST['value1']; 
$y = $_POST['value2'];