Потому что мой динамический заголовок отображается неправильно? - PullRequest
Новая
       4

Потому что мой динамический заголовок отображается неправильно?

0 голосов
/ 12 ноября 2018

У меня есть вопрос о моем тестовом коде JS.Мне нужно, чтобы каждый интервал 1500 показывал следующий символ, но по какой-то причине я не вижу, где они автоматически умножаются, пока браузер не прослушивается.Я делюсь кодом здесь: 

<title>Minuevotitulodeprueba</title>
<script type="text/javascript">
    var i=1;
    var LegitTitle = document.title;
    function ChangeTitle(){
        document.title = LegitTitle.substring(0,i);
        i++;
        if(i>LegitTitle.length) 
            i = 0;
        setInterval('ChangeTitle()',1500);  
    }
    ChangeTitle()
</script>

Я новый разработчик, я прошу пощады xdd

Ответы [ 3 ]

0 голосов
/ 12 ноября 2018

Вы устанавливаете новый интервал каждый раз, когда вызываете функцию, но итерация вызывает функцию на интервале, а не на тайм-ауте. Поэтому вы можете избежать этой проблемы, объявив итерацию за пределами вызова функции. 

var i=1;
    var LegitTitle = document.title;
    function ChangeTitle(){
        
        document.title = LegitTitle.substring(0,i);
        
        if(i>LegitTitle.length) {
            i = 0;
        }
        console.log('i = ' + i);
        console.log('Title = ' + document.title);
        i++;
    }
    ChangeTitle();
    setInterval(ChangeTitle,1500);
    
<title>Minuevotitulodeprueba</title>
0 голосов
/ 12 ноября 2018

Единственная проблема, с которой вы столкнулись, это то, что вы использовали setInterval вместо setTimeout ... Простой обмен, и код работает нормально. 

var i = 1;
var LegitTitle = document.title;

function ChangeTitle() {
  document.title = LegitTitle.substring(0, i);
  console.log(document.title)
  i++;
  if (i > LegitTitle.length)
    i = 0;
  setTimeout('ChangeTitle()', 1500);
}
ChangeTitle()
<title>Minuevotitulodeprueba</title>
0 голосов
/ 12 ноября 2018

С вашим кодом есть две проблемы

  1. Первый параметр функции setInterval должен быть не строкой, а функцией -> setInterval(ChangeTitle,1500);.Хотя это будет работать со строковой версией (выражением), но это не рекомендуется.
  2. Вы не должны использовать setInterval внутри функции, которая сама вызывается в setInterval, если только вы не знаете, чтовы делаете

Поместите это вне функции ... 

var i = 1;
var LegitTitle = document.title;
function ChangeTitle(){
  document.title = LegitTitle.substring(0,i);
  i++; 
  if (i > LegitTitle.length) {
    i = 0;
  }
  console.log(document.title)
}

setInterval(ChangeTitle,1500);  
<title>Minuevotitulodeprueba</title>

... или используйте setTimeout вместо setInterval

var i = 1;
var LegitTitle = document.title;
function ChangeTitle(){
  document.title = LegitTitle.substring(0,i);
  i++; 
  if (i > LegitTitle.length) {
    i = 0;
  }
  console.log(document.title)
  
  setTimeout(ChangeTitle, 1500);
}

ChangeTitle()
<title>Minuevotitulodeprueba</title>
...