Javascript 如何修改setInterval代码以最初触发Interval操作

我不是一个JavaScript专家，但我发现了一个脚本，它将帮助我完成我需要的，但我需要对它进行一个小的修改。以下是JS代码：

$('html').addClass('js');

$(function() {

  var timer = setInterval( showDiv, 4000);

  var counter = 0;

  function showDiv() {
    if (counter ==0) { counter++; return; }

    $('#div1, #div2, #div3, #div4')
      .stop()
      .hide()
      .filter( function() { return this.id.match('div' + counter); })   
      .show('fast');
    counter == 4? counter = 0 : counter++; 

  }

});

下面是一个html代码：

<div id='container'>
<div id='div1' class='display' style="background-color: red;"> 
  div1
</div>

<div id='div2' class='display' style="background-color: green;"> 
  div2
</div>

<div id='div3' class='display' style="background-color: blue;"> 
  div3
</div>
<div id='div4' class='display' style="background-color: yellow;"> 
  div4
</div>
<div>

第一组
第二组
第三组
第四组

现在，这个脚本要做的是在页面打开10秒后显示第一个div，然后关闭它并打开下一个div。我需要更改的是删除第一个div的10秒时间间隔，这样它就可以打开页面，而其他div的时间间隔保持不变。我希望你能理解我想要实现的目标。感谢您的帮助。

第一次手动调用

showdiv（）

，在上面设置计时器并将计数器初始化移到上面：

...
var counter = 1;
showDiv();
var timer = setInterval( showDiv, 4000);
...

第一次只需手动调用

showdiv（）

，在上面设置计时器并将计数器初始化移到上面：

...
var counter = 1;
showDiv();
var timer = setInterval( showDiv, 4000);
...

---

请尝试以下解决方案：

showDiv();
var timer = setInterval(showDiv, 4000);

var counter = 1;
function showDiv(){
  $('.display').hide();
  $('#div'+counter).show();
  (counter == 4 ? counter = 1 : counter++)
}

工作示例：

---

您还可以利用jQuery函数animate（）或fadeIn（）对转换应用效果。

尝试以下解决方案：

showDiv();
var timer = setInterval(showDiv, 4000);

var counter = 1;
function showDiv(){
  $('.display').hide();
  $('#div'+counter).show();
  (counter == 4 ? counter = 1 : counter++)
}

工作示例：

---

您还可以使用jQuery函数animate（）或fadeIn（）对转换应用效果。

我建议您的第一个div从一开始就可以使用css看到。 在javascript中，按照最初编程的方式设置间隔。 以1开始你的计数器。 在showDiv中，将其升高。将初始支票放在您返回的位置。 对于其他人来说，这应该是可行的。如果没有，请给我回电话。

---

明天我将在我的电脑上编写实际的代码

我建议您使用css从一开始就可以看到您的第一个div。 在javascript中，按照最初编程的方式设置间隔。 以1开始你的计数器。 在showDiv中，将其升高。将初始支票放在您返回的位置。 对于其他人来说，这应该是可行的。如果没有，请给我回电话。

---

---

明天我将在我的电脑上编写实际的代码

小错误，但你有

，在底部

应该是

。我猜这只是一个复制/粘贴错误。谢谢你让我知道这一点，我没有注意到div没有完全错误，但是你有

，在底部

应该是

。我猜这只是一个复制/粘贴错误。谢谢你让我知道这一点，我没有注意到div没有关闭，但它不工作，在页面加载时它没有显示第一个，但4秒钟后，这只减少了第一个的时间，因为我现在注意到它实际上跳过了第一次迭代。它降低了第一次的时间，因为在此之前，第一次的时间是8秒。您能尝试用1初始化计数器吗？我还更新了这个例子。问题是你的计数器var阻塞了第一个executiom（手动调用），很高兴它解决了这个问题Boris-你甚至可以接受答案：）尝试了，但它不起作用，在页面加载时它没有显示第一个，但4秒钟后，这只会尽可能减少第一个的时间，因为我现在注意到它实际上跳过了第一次迭代。它降低了第一次的时间，因为在此之前，第一次的时间是8秒。您能尝试用1初始化计数器吗？我还更新了这个示例。这里的问题是您的计数器var阻止了第一个executiom（手动调用），很高兴它解决了问题Boris-您甚至可以接受答案：）是的，并且（）将停止setInterval的工作，因为showDiv不返回函数。这不起作用。你必须传递一个函数指针，而不是函数的执行。我请求第五个lol…很长的一天。我已经更新到一个有效的解决方案。除非我再次错过了什么。是的，并且（）将停止setInterval的工作，因为showDiv不会返回函数。这不起作用。你必须传递一个函数指针，而不是函数的执行。我请求第五个lol…很长的一天。我已经更新到一个有效的解决方案。除非我又错过了什么。是的，你可以用CSS来做，但是你不会得到第一个动画。哦，是的，真的！我想我的反应有点太快了。是的，你可以用CSS来做，但是你不会得到第一个动画。哦，是的，真的！我想我的反应有点太快了。