Javascript 如何将变量的值添加到我的HTML中？

我有两个单独的实例，其中我在页面的标题中显示来自JavaScript的数据：

Html:

更多jQuery：

$.get('php/FetchGames/GetMatchCount.php', function (data) {
    MatchCountJson = data;
    MatchCountJson_Parsed = JSON.parse(MatchCountJson);
    MatchCount = MatchCountJson_Parsed.Int;
    //the above JSON is {"Int":72}
});

$('#Fetch_Header').html('Time to apply your MMR, follow the instructions below. Matches left to apply: ' + MatchCount);

然而，只有以前的作品（最近的作品）

第一个输出：

日期（如预期）

第二输出：

“应用MMR的时间到了，请按照下面的说明进行操作。左侧为匹配项
要应用：未定义“

---

这两个变量都不是

null/undefined

，因为如果我使用

Console.log

，那么

lastdate

是一个日期，

Matchcount

是一个整数（例如32）。

Matchcount

在您尝试使用它时超出了代码的范围

.get（）

是一个异步调用，这意味着不能保证在执行下一条指令时调用完成。如果要使用基于

数据的任何内容

，则需要在

get（）

调用中的回调函数范围内进行

$.get('php/FetchGames/GetMatchCount.php', function(data){
    MatchCountJson = data;
    MatchCountJson_Parsed = JSON.parse(MatchCountJson);
    MatchCount = MatchCountJson_Parsed.Int;

    // Call must be inside of "get()" callback
    $('#Fetch_Header').html('Time to apply your MMR, follow the instructions below. Matches left to apply: '+MatchCount);
});

---

只能在get方法的结果中使用MatchCount变量。 试试这个

---

问题是从服务器传回的数据的范围，因此第二次html插入无法访问MatchCount。将代码更改为：

 $.get('php/FetchGames/GetMatchCount.php', function(data){
    MatchCountJson = data;
    MatchCountJson_Parsed = JSON.parse(MatchCountJson);
    MatchCount = MatchCountJson_Parsed.Int;
    //the above JSON is {"Int":72}
    $('#Fetch_Header').html('Time to apply your MMR, follow the instructions below.        Matches left to apply: '+MatchCount);
});

---

由于jQuery是异步的，因此当HTML应用于#Fetch_Header

时，获取的值可能不可用。get

是异步的。这就是

AJAX

中的

A

的含义。因此，在AJAX调用完成之前（可能是将来的某个时间），不会调用回调函数（在回调函数中，您为

MatchCount

）指定一个值。因此，当您执行下一行（

.html

）时，

匹配计数

未定义。

$.get

在您尝试访问

匹配计数

变量时仍在处理。在第一个示例中，您在回调中使用变量，在第二个示例中，您在回调外部使用变量。这就是为什么示例2不起作用的原因。就是这样。该死我不太习惯Javascript的异步特性。我对编码还不熟悉，我的大脑感觉它会按照指令顺序工作。非常感谢。JavaScript不是同步的，get是一种AJAX方法jQuery@k4kuz0正如Daniel所说，JS本身并不是异步的。当您调用

get（）

时，它会立即执行，请求会发送到您的URL，回调（

函数（数据）…

）会被注册（保存）。基本上，该函数会一直保存到网络返回URL为止，此时当前JS流被中断，回调将以返回的数据作为参数执行。如果这段代码是同步的，并等待URL返回后再继续，那么即使在速度稍慢的网络上，代码也会明显挂起。这就是阿贾克斯之美。@JeffB我明白了！谢谢你的解释。

$.get('php/FetchGames/GetMatchCount.php', function(data){
    MatchCountJson = data;
    MatchCountJson_Parsed = JSON.parse(MatchCountJson);
    MatchCount = MatchCountJson_Parsed.Int;

    // Call must be inside of "get()" callback
    $('#Fetch_Header').html('Time to apply your MMR, follow the instructions below. Matches left to apply: '+MatchCount);
});

$.get('php/FetchGames/GetMatchCount.php', function(data){
    MatchCountJson = data;
    MatchCountJson_Parsed = JSON.parse(MatchCountJson);
    MatchCount = MatchCountJson_Parsed.Int;
    //the above JSON is {"Int":72}

    $('#Fetch_Header').html('Time to apply your MMR, follow the instructions below. Matches left to apply: '+MatchCount);
});

 $.get('php/FetchGames/GetMatchCount.php', function(data){
    MatchCountJson = data;
    MatchCountJson_Parsed = JSON.parse(MatchCountJson);
    MatchCount = MatchCountJson_Parsed.Int;
    //the above JSON is {"Int":72}
    $('#Fetch_Header').html('Time to apply your MMR, follow the instructions below.        Matches left to apply: '+MatchCount);
});