Question

可以用javascript / jQuery交换一段文本吗？我想要一个大约5秒的延迟计时器，然后文本应该交换到其他东西，如图像幻灯片。褪色或效果会很棒，但无论多么有效。你能指出我正确的方向还是帮助我？

Answer 1

setTimeout(function() {
  $('#target').html('New Text');
}, 5000); // <- 5 seconds

如果你想进一步了解

setInterval(function() {
  // do some change that will happen every 5 seconds
}, 5000); // <- 5 seconds

Answer 2

Here you go

您也可以使用setTimeout调用该函数

修改：

Here is the tweaked demo, without a click and with interval

编辑2 ：

复制粘贴代码，以防jsfiddle发生故障。

<div class="texts"> <p class="text text_1">text 1</p> <p class="text text_2">text 2</p> </div> <script> setInterval(function(){ var toggle = $(".text").hasClass("toggled"); $(".text_1").animate({opacity: toggle ? 1 : 0}); $(".text_2").animate({opacity: toggle ? 0 : 1}); $(".text").toggleClass("toggled"); }, 1000); </script> <style type="text/css"> .texts { position: relative; } .text { position: absolute; top: 0; left: 0; } .text_1{ opacity: 1 } .text_2{ opacity: 0; } </style>

Answer 3

以下是没有setTimeout或setInterval

的循环方式

DEMO HERE

<div id="textMessage"></div>
<div class="textContent" style="display:none">Lorem ipsum dolor sit amet</div>
<div class="textContent" style="display:none">In sit amet diam et arcu aliquam tincidunt. </div>

function slide() {
  if (cnt>=texts.length) cnt=0;
  $('#textMessage').html(texts[cnt++]);
  $('#textMessage')
    .fadeIn('slow').animate({opacity: 1.0}, 3000).fadeOut('slow',
     function() {
       return slide()
     }
  );      
}      
$(document).ready(function() {
  // save the texts in an array for re-use
  $(".textContent").each(function() {
    texts[cnt++]=$(this).text();
  });
  slide()  
});

Answer 4

function changeText(){
     document.getElementById('my_div_id').innerHTML = 'text_to_display';
}

你可以实现changetext以拥有一个字符串数组，你可以在下一个函数内迭代：

function timingex( ){
    setTimeout("changeText()",5000);
}

Answer 5

将您希望淡入的内容（我们可以将其命名为#box）放在<p>之上。隐藏display:none;。然后使用例如：

function() {
    $("#box").delay(5000).fadeIn("slow");
}

定时文本交换？

5 个答案: