Блог

Главная - Вопросы по программированию - Javascript автоматически изменяет строку

Javascript автоматически изменяет строку

#javascript

#javascript

Вопрос:

Привет, я новичок в javascript и пытаюсь выяснить, как добавить строку через отведенное количество времени.

 After 3 secs append string (How)
After 3 secs append string (are)
After 3 secs append string (you)
After 3 secs append string (?)

Спасибо:D

Комментарии:

1. Пожалуйста, прислушайтесь к комментарию @SLaks и не передавайте строку в setTimeout . Это eval замаскировано.

Ответ №1:

Используйте setTimeout .

 var text = 'How are you ?'.split(' '),
    delay = 3000;

function generateCallback(text) {
    return function () {
        alert(text);
    };
}

for (var i=0; i<text.length; i  ) {
    setTimeout(generateCallback(text[i]), delay*(i 1));
}

http://jsfiddle.net/mattball/dYBUs/

Ответ №2:

 <html>
    <head></head>
    <body>
        <span id="mySpan"></span>
    </body>
    <script>
        setTimeout('document.getElementById("mySpan").innerHTML  = "How ";', 3000);
        setTimeout('document.getElementById("mySpan").innerHTML  = "are ";', 6000);
        setTimeout('document.getElementById("mySpan").innerHTML  = "you";', 9000);
        setTimeout('document.getElementById("mySpan").innerHTML  = "?";', 12000);
    </script>
</html>

Комментарии:

1. Не передавайте строку в setTimeout .

2. Пожалуйста, не советую передавать строки в setTimeout . Это eval замаскировано.

Ответ №3:

В качестве модификации текущих ответов можно использовать один setInterval вызов, отменяющий его, когда отображаются все слова:

 // s is string to display
// interval is the time in milliseconds between adding words
// id is the id or reference to a DOM element to display s in
function staggerDisplay(s, interval, id) {

  var el = typeof id == 'string'? document.getElementById(id) : id;
  var sBits = s.split(' ');
  var numWords = sBits.length;
  var i = 0;
  var intervalRef = setInterval(
    function () {
      if (i < numWords) {
        el.innerHTML  = ' '   sBits[i  ];
      } else {
        clearInterval(intervalRef);
      }
    }, interval);
}