HTML 通过 Java 脚本更新某些值

Question

我使用 ajax 并且这几天一直在努力寻找解决方案。如下图所示，我已经在控制台中得到了一个 Json 文件。但是我仍然无法将其分开然后显示在 :

 <span ...>...</span>

那应该是每秒更新的实时数据。

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script type="text/javascript">
var intervalID = setInterval(update_values,1000);
var $SCRIPT_ROOT = {{ request.script_root|tojson|safe }};
function update_values()
{
    $.getJSON($SCRIPT_ROOT + '/update',
            function(data)
            {
                $('#update_data').getJSON
                console.log(data)
            });
};
</script>

...

<div class="card card-gray" id="card_bord1">
<h4>Board 1</h4>
<img src="../static/img/Rotary_Board_BW.png">
<p>Value: {{actuel_value_board1_html}}
    <span id="update_data">?</span>
    <script>
        document.getElementById("update_data").getE
    </script>
</p>
<label class="labelOFFLINE">Online</label>
</div>

Answer 1

如果您的数据看起来像这样，您需要“深入研究”它。

var dataJSON = [{
  "update_data": {
    '1': {
      "active_value": '1e+31',
      "is_active": false
    },
    '2': {
      "active_value": '5',
      "is_active": false
    }
  }
}]

setInterval(function() {
    // ajax call to data (I am using static json object above)
  data = dataJSON;
  
  
  // example one line drill-down
  console.log(data[0].update_data[1].is_active);

  // example "digging"
  console.log(data);
  data = data[0];
  console.log(data);
  data = data.update_data;
  console.log(data);
  data = data[1];
  console.log(data);
  data = data.is_active;
  console.log(data);

  var status = data ? 'Online' : 'Offline';
  $('.labelOFFLINE').html(status);
}, 1000);

所有这些都将包装在一个 setInterval() 函数中，如上所示每 1000 毫秒（1 秒）轮询一次。

https://jsfiddle.net/fu7Ld0x9/

HTML 通过 Java 脚本更新某些值

HTML update certain values via Java script

html

javascript

ajax