将内容添加到每一个

Question

如何使用javascript每20秒更新一次marquee中的内容？

我的意思是，在前20秒，读取第一个对象，在第二个40秒读取第二个对象，等等。，而不更新页面，则意味着自动更新它。

这是javascript函数：

    function read () {
  $.getJSON("jsons/jobs.json", function(json) {
  Thejobs = json;
  for(var k in Thejobs.Studies){
     $('#boxContent').append('<br>'+"position: "+Thejobs.Studies[k].position+
     '<br>'+"Academy: "+Thejobs.Studies[k].academy+'<br>'+"address: "
     +Thejobs.Studies[k].address+'<br>'+"Description: "+Thejobs.Studies[k].jobDescription)
     $('#boxContent').append("<br>_____________________");
     }}); }

这是我的json文件：

   {"Studies": {
    "jobID1": {
        "position": "student position",
        "academy": "Haifa University",
        "address": "haifa,isreal",
        "jobDescription": "Big data"
    },
    "jobID2": {
        "position": "Research 1",
        "academy": "saarland University",
        "address": "saarbrucken , germany",
        "jobDescription": "Electronic engineer"
    },
    "jobID3": {
        "position": "Studie 1",
        "academy": "Technion",
        "address": "haifa,isreal",
        "jobDescription": "Speed of internet"
    },
    "jobID4": {
        "position": "Studie 2",
        "academy": "Technion",
        "address": "USA ,los angeles",
        "jobDescription": "analysis data "
    }
}

}

html文件：

  <marquee direction="up" scrollamount="2">
  <p id="boxContent"></p>
   </marquee>

我试过了，但没有成功：

<script>
var myVar = setInterval(joobs(), 20000);
var ii=0;
function joobs(){
  $.getJSON("jsons/jobs.json", function(json) {
   Thejobs = json;
     $('#boxContent').append('<br>'+"position: 
   "+Thejobs.Studies[ii].position+
    '<br>'+"Academy: "+Thejobs.Studies[ii].academy+'<br>'+"address: "
    +Thejobs.Studies[ii].address+'<br>'+"Description: 
  "+Thejobs.Studies[ii].jobDescription)
    $('#boxContent').append("<br>_____________________");
   });
     ii=ii+1; 
      </script>

Answer 1

我禁不住让这令人厌恶。

如果您需要在一定的时间间隔内做一些事情，请使用setInterval。它具有签名setInterval(callback_function, interval_in_milliseconds);，只需将函数更改为marquee的值作为回调，并将间隔设置为20000，延迟20秒。您的函数将每20秒调用一次，如下面的示例所示。

​

var values = ["Marquees", "shall", "never", "die.", "Long", "live", "the", "marquee!"];
var iterator = 1;
var colorator = 0;
function updateMarquee() { 
  document.getElementById('boxContent').innerHTML = values[iterator];
  iterator = (iterator + 1) % values.length;
  console.log("updateMarquee() has been called");
  
  return function() {
    console.log("updateMarquee() return value was called instead of the function");
  };
}

setInterval(updateMarquee, 1000);
setInterval(updateMarquee(), 10000);

<marquee direction="right" scrollamount="10" behavior="alternate">
  <p id="boxContent">Marquees</p>
</marquee>

​

更新:关于user78403的答案，我更新了代码片段，以显示在setInterval中调用函数本身与调用函数返回值之间的区别。在这个例子中，您将看到updateMarquee() has been called每秒钟记录一次，因为setInterval(updateMarquee, 1000);行。但是，您还将看到updateMarquee() return value was called instead of the function每10秒记录一次，因为行setInterval(updateMarquee(), 10000);

别用遮羞布。20年前，在网站上自动移动、播放、更改任何东西都可能让人心烦意乱，但现在它只是恼人的，用户会看不起你的网站。你应该有一个静态的列表，你的工作机会，用户可以阅读自己的速度。

Answer 2

我纠正了代码中的一些语法错误。我会解释我做过的最重要的事情：

• setInterval(joobs(), 20000) -> setInterval(joobs, 20000)：必须将方法本身作为参数传递。否则，方法将被调用，其返回值将每20秒执行一次。
• Thejobs.Studies[ii] -> Thejobs.Studies["jobID" + ii]：将属性名称指定为索引。传递一个号码是行不通的。由于JSON文件的属性名，因此还需要使用1而不是0初始化JSON。
• 我还增加了一些遗漏的括号。

HTML和JSON不会更改。所以看起来都是这样的：

var myVar = setInterval(joobs, 20000);
var ii=1;
function joobs() {
    $.getJSON("jsons/jobs.json", function (json) {
        var Thejobs = json;
        $('#boxContent').append('<br>' + "position:" +
            Thejobs.Studies["jobID" + ii].position +
            '<br>' +
            "Academy: " +
            Thejobs.Studies["jobID" + ii].academy +
            '<br>' +
            "address: " +
            Thejobs.Studies["jobID" + ii].address +
            '<br>' +
            "Description:" +
            Thejobs.Studies["jobID" + ii].jobDescription);
        $('#boxContent').append("<br>_____________________");
    });
    ii = ii + 1;
}