Question

我已经创建了一个带变量的JSON文件。但是我无法将值赋给JSON中的变量。

我的HTML文件是： -

<div class="col-xs-9 text-right">
 <div class="huge">
    <p id="demo"></p>
 </div>
 <div>Total</div>
</div>

我的Javascript是： -

<script>
      var text = 'http://localhost:8080/SampleGUI/total.txt';
      var obj = JSON.parse('text');
      document.getElementById("demo").innerHTML = obj.total; 

</script>

我的JSON是： -

  {
     "text": {
      "total":"19838"
  }

}

我的HTML变量分配不断出现无效字符错误。

你可以帮我一下吗？

问候。

Answer 1

不应该是：

 document.getElementById("demo").innerHTML = obj.text.total;

Answer 2

当你说

时

var obj = JSON.parse('text');

您正在解析无效JSON的字符串"text"。

例如：

$ node
> JSON.parse("text")
SyntaxError: Unexpected token

也许您打算在名为text的变量中解析JSON字符串，因此请删除引号。

这应该让你朝着正确的方向前进：

$ node
> var text = '{ "text": { "total": "19838" } }'
undefined
> JSON.parse(text).text.total
'19838'

Answer 3

由于你试图获取文件，你可能想要使用XMLHttpRequest来检索，所以这样的事情可以做“untested：

var xmlhttp = new XMLHttpRequest();
var url = "http://localhost:8080/SampleGUI/total.txt";

xmlhttp.onreadystatechange = function() {
    if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
        console.log("response",xmlhttp.responseText);
        var obj = JSON.parse(xmlhttp.responseText);
        document.getElementById("demo").innerHTML = obj.text.total; 
    }
}
xmlhttp.open("GET", url, true);
xmlhttp.send();

如果你使用jquery这样的话

$.getJSON("http://localhost:8080/SampleGUI/total.txt", function(data) {

    $("#demo").text = data.text.total; 
});

我附上了一个工作http://jsfiddle.net/nk0ynou1/

的jsfiddle

无法将JSON值分配给HTML中的变量

3 个答案: