jQuery 和 HTML 中的 if 语句？

Question

我正在成功运行以下脚本：它每 3 秒更新一次文本

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>
<script>
$(function() {
  window.setInterval(function() {
    loadNewText()
  }, 3000)

  function loadNewText() {
    $.ajax({
      url: "/update_report",
      type: "POST",
      dataType: "json",
      success: function(data) {
        $(report).replaceWith(data)
      }
    });
  }
});
</script>

我想将 HTML 中的函数更改为仅在 Python 代码中的某些变量发生更改时才运行“loadNewText()”！

我已将变量放入 python 路由中：

@app.route('/console-output')
def console_output():
    fileHandle = open("console_output.txt", "r")
    lineList = fileHandle.readlines()
    fileHandle.close()
    last= lineList[len(lineList)-1]
    with open('console_output.txt', 'r') as r:
        co =r.read()
    return render_template("console-output.html",console_output_msg=console_output_msg, last=last, co=co)

并在 HTML 中编写以下代码：

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>
<script>
$(function() {

  if (last != console_output_msg) {
    loadNewText();
  }

  function loadNewText() {
    $.ajax({
      url: "/update_text",
      type: "POST",
      dataType: "json",
      success: function(data) {
        $(new_text).replaceWith(data)
      }
    });
  }
});
</script>

此方法无效！我对 Javascript 没有丰富的经验！我不知道我是否没有以正确的方式调用变量（最后一个，console_output_msg）或者我的函数无效！

如果有任何方法可以纠正它或任何其他建议在 python 代码发生更改时调用“loadNewText()”！

谢谢！

Answer 1

您无法在客户端访问服务器变量。

您可以将先前的输出保存在 JavaScript 变量中，并且仅在 DOM 发生更改时才更新它。需要在loadNewText()函数收到响应后，将if语句放入函数中，以便比较。

这不会跳过 AJAX 调用，但会避免在没有任何更改时刷新页面。

$(function() {
  let last_output;
  window.setInterval(loadNewText, 3000)

  function loadNewText() {
    $.ajax({
      url: "/update_report",
      type: "POST",
      dataType: "json",
      success: function(data) {
        if (data != last_output) {
          $(report).replaceWith(data);
          last_output = data;
        }
      }
    });
  }
});

Answer 2

当 Python 发生变化时，有 2 种流行的方式来更新文本：

• 长轮询
  使用setInterval()函数触发ajax调用服务端检查是否有变化。

• WebSocket
  在服务器和浏览器之间实现 WebSocket 连接。接收服务器发来的消息。

  在 Python 中实现 WebSocket 的链接。
  https://websockets.readthedocs.io/en/8.1/intro.html