javascript - 如何在 <td> 表列中显示 javascript 标签

Question

我有一个关于表格中数据显示的问题。 此处发布的示例代码是我在表格中的代码的一部分。我认为这足以解决这个问题:

如果我把

<label id="HMI_scaled">0</label>

在我页面中随机位置的表格外，显示数据。

由于本文后面显示的 javascript，HMI_scaled 是一个自动更新的值。问题是我不知道如何键入在我的表中显示它的语法。我试过了，但它没有像在表外那样更新。

<table>
  <tr>
    <td class="static_field">Level [m]:</td>
    <td class="output_field"><label id="HMI_scaled">0</label></td>
  </tr>
</table>

HMI_scaled 脚本:

$(document).ready(function(){
    $.ajaxSetup({ cache: false });
    setInterval(function() {
        $.get("IOwebserver.htm", function(result){
            $('#HMI_scaled').text(result.trim());
        });
    },1000);
});

CSS:

td.output_field
{
    font-size : 12px;
    background-color : rgb(221,221,221);
    text-align : left;
    width : 150px;
    height : 21px;
}

td.static_field
{
    font-size : 12px;
    text-align : right;
    width : 150px;
    height : 21px;
}

HTML:

  IOwebserver.htm
    :="webdata".HMI_scaled:

Answer 1

我发现您的代码没有问题，它对我有用。请参阅下面，我用代码替换了您的 ajax 调用以每秒显示当前时间。无论 <label> 在哪里，它都有效是。

检查您没有出现 HTML 拼写错误，并且您在页面顶部包含了 jQuery。

$(document).ready(function(){
    $.ajaxSetup({ cache: false });
    setInterval(function() {
        var result = new Date().toLocaleTimeString();
        $('#HMI_scaled').text(result.trim());
        $('#HMI_scaled_2').text(result.trim());
    }, 1000);
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table border="1">
  <tr>
    <td class="static_field">Level [m]:</td>
    <td class="output_field">Inside table -&gt; <label id="HMI_scaled">0</label></td>
  </tr>
</table>
Outside table -&gt; <label id="HMI_scaled_2">0</label>