Question

我正在尝试使用AJAX将JavaScript中的变量发送到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函数的click事件。

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);
    }
});

然后在loadSketch.php中选择你的POST参数并使用它们。

PHP：

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

jQuery Ajax没有将Post数据发送到PHP文件

2 个答案: