Javascript 使用ajax将数据发布到PHP文件

我通过对php文件的$.ajax调用发布数据。ajax调用完成后，我运行另一个javascript函数，对php文件执行$.getJSON

php文件中有一个变量，该变量应该具有来自ajax的发布数据的值，但它是空的

function inputSummonerName() {
    inputName = prompt("summoners name");

    $.ajax({
        type: 'POST',
        url: 'ajax.php',
        data: { n : inputName },
        complete: function() {
            getImageData();
        }
    });
}

function getImageData() {
    $.getJSON('ajax.php', function (json) {
        if(!json){
            console.log("empty");
        }
        else{
            $.each(json, function (index) {
                summonerProfileIconId = json[index].profileIconId;
                summonerName = json[index].name;
                summonerLevel = json[index].summonerLevel;
                $(".summonerName").text(summonerName);
                $(".summonerProfileIconId").attr("src", "http://ddragon.leagueoflegends.com/cdn/4.13.1/img/profileicon/" + summonerProfileIconId + ".png");
                $(".summonerLevel").text("Level" + summonerLevel);
            });
        }
    });
}

以下是php文件ajax.php：

<?php
    $apikey = "...";
    if (isset($_POST["n"])) {
        $summonerName = $_POST["n"];
    }

    $data = json_decode(file_get_contents("https://euw.api.pvp.net/api/lol/euw/v1.4/summoner/by-name/" . $summonerName . "?api_key=" . $apikey ));

    echo json_encode($data);

    ...
?>

---

试着把n加引号，它应该是一个键，而不是一个变量。 即：

---

PS：如果您真的想要，还有jquery的简写，您对PHP文件发出了两个请求

$.ajax

-从远程服务器获取所需数据并返回

$.getJSON

-再次点击远程服务器（但名称丢失），并返回该名称

您正在尝试从2获取数据，但该数据不存在。不要使用

getJSON

。只需在第一个

complete

函数中使用数据即可。最好使用

success

，这样在发生服务器错误时就不会尝试使用它。考虑添加显式<代码>错误< /代码>处理程序。

您还应该编写PHP，以便它告诉浏览器它正在发送JSON而不是HTML，并且没有必要先解码JSON，然后再重新编码

例如：

然后在JS中：

function inputSummonerName() {
    inputName = prompt("summoners name");
    $.ajax({
        type: "POST",
        url: "ajax.php",
        data: {
            n: inputName
        },
        success: function(a) {
            if (!a) console.log("empty"); else $.each(a, function(b) {
                summonerProfileIconId = a[b].profileIconId;
                summonerName = a[b].name;
                summonerLevel = a[b].summonerLevel;
                $(".summonerName").text(summonerName);
                $(".summonerProfileIconId").attr("src", "http://ddragon.leagueoflegends.com/cdn/4.13.1/img/profileicon/" + summonerProfileIconId + ".png");
                $(".summonerLevel").text("Level" + summonerLevel);
            });
        }
    });
}

---

您使用$.ajaxá和$.getJSON（它是$.ajax的包装器）两次调用脚本。 解决方案：

function inputSummonerName()
{
    inputName = prompt("summoners name");

    $.ajax({
        type: 'POST',
        url: 'ajax.php',
        data: { n : inputName},
        success: function(data, textStatus, jqXHR)
        {
            getImageData($.parseJSON(data));
        },
        error: function(jqXHR, textStatus, errorThrown)
        {
            //handle your error!
        }
    });

}

function getImageData(data)
{
    $.each(data, function (index) 
    {
        summonerProfileIconId = data[index].profileIconId;
        summonerName = data[index].name;
        summonerLevel = data[index].summonerLevel;
        $(".summonerName").text(summonerName);
        $(".summonerProfileIconId").attr("src", "http://ddragon.leagueoflegends.com/cdn/4.13.1/img/profileicon/" + summonerProfileIconId + ".png");
        $(".summonerLevel").text("Level" + summonerLevel);
    });
}

---

我还将complete更改为success/error，以便在出现错误时，其他函数不会因为非数组值而生气。

n

是一个完全可以接受的标识符，因此可以作为JS对象文本中的属性名。它将不会被视为变量。谢谢，我不知道关于$.ajax和$.getJSON。还感谢您提供关于json解码部分的提示，我应该知道这一点。您是否尝试直接命中PHP文件（使用eg-curl）？您是否尝试过设置一个静态文件并使用ajax实现它？

function inputSummonerName() {
    inputName = prompt("summoners name");
    $.ajax({
        type: "POST",
        url: "ajax.php",
        data: {
            n: inputName
        },
        success: function(a) {
            if (!a) console.log("empty"); else $.each(a, function(b) {
                summonerProfileIconId = a[b].profileIconId;
                summonerName = a[b].name;
                summonerLevel = a[b].summonerLevel;
                $(".summonerName").text(summonerName);
                $(".summonerProfileIconId").attr("src", "http://ddragon.leagueoflegends.com/cdn/4.13.1/img/profileicon/" + summonerProfileIconId + ".png");
                $(".summonerLevel").text("Level" + summonerLevel);
            });
        }
    });
}

function inputSummonerName()
{
    inputName = prompt("summoners name");

    $.ajax({
        type: 'POST',
        url: 'ajax.php',
        data: { n : inputName},
        success: function(data, textStatus, jqXHR)
        {
            getImageData($.parseJSON(data));
        },
        error: function(jqXHR, textStatus, errorThrown)
        {
            //handle your error!
        }
    });

}

function getImageData(data)
{
    $.each(data, function (index) 
    {
        summonerProfileIconId = data[index].profileIconId;
        summonerName = data[index].name;
        summonerLevel = data[index].summonerLevel;
        $(".summonerName").text(summonerName);
        $(".summonerProfileIconId").attr("src", "http://ddragon.leagueoflegends.com/cdn/4.13.1/img/profileicon/" + summonerProfileIconId + ".png");
        $(".summonerLevel").text("Level" + summonerLevel);
    });
}