1

Question

我通过创建一个程序来学习javascript，该程序请求API并将各种属性（本例中的价格）发送给html。我对我的代码以及我一直面临的一些问题提出了一些问题。

1）。我有一堆$.getJSON函数对应于我想要检索的每个值。我把它们全部放在一个2分钟内。计时器。但是，当页面FIRST加载时，某些html元素根本无法加载。但是，如果我刷新页面，他们有时会加载。如果我再次刷新，它们可能根本不再加载。每次刷新时，都有10％的可能性，特定功能没有在元素中插入内容。如果它确实加载并且我打开页面，它将正确运行（每2分钟更新其值和html元素并添加/删除绿色和红色类）。如果它没有加载并且我打开页面，那么当第二个api请求发出时它将在2分钟内正常运行。我已经测试过变量在每个$('#price').text('$' + price);之前和之后都有一些值（非空）。

以下是执行此操作的函数示例：

var tempPrice;
var myVar = setInterval(myTimer, 1200000);
myTimer();

function myTimer() {
  $.getJSON(link, function (json) {
    $.each(json, function (index, value) {
      if (value.id == "price") {
        var price = value.price_eur;
        if (!tempPrice) {
          $('#price').text('$' + price);
          tempPrice = parseFloat(price);
        }
        if (parseFloat(price) !== tempPrice) {
          $('#price').text('$' + price).removeClass();
          if (parseFloat(price) > tempPrice) {
            setTimeout(function () {
              $('#price').addClass("green");
            }, 1);
          } else {
            setTimeout(function () {
              $('#price').addClass("red");
            }, 1);
          }
          tempPrice = parseFloat(price);
        }
      }
    });
  });
  // Many more $.getJSON functions below...
}

如果我在jsfiddle或我的开发服务器（烧瓶）上单独运行此功能，它可以正常工作。它只在我与更多api请求一起使用时才会崩溃。如果我没记错的话，之前我没有遇到过这个问题，因为我曾经为每个$.getJSON函数设置一个单独的计时器，并将每个函数直接放在html中。{/ p >

2）我知道我可以遍历json而不是使用<script>。我还能如何改进代码？

Answer 1

1

至于您对初始页面加载的不一致行为所带来的问题，这是因为您在给浏览器首先完全加载页面之前执行JavaScript。您只需等待页面加载，然后执行代码即可解决此问题。

jQuery中的示例：

$(document).ready(function() {
    // Page is loaded, execute code...
});

2

为了帮助您改进处理提供的JSON数据的方式，数据样本将非常有用。

有时，jQuery仅更新首页加载时的元素

1 个答案:

1

2