У меня есть небольшая скрипка, с которой я экспериментировал, и я заметил, что вызов функции внутри условия цикла for останавливал цикл. Собственно, изначально я хотел сделать вот что:

// add event listeners to tabs
for (i=0;i<tabs.length;i++) {
    tabs[i].addEventListener('click', function(event) {
        var tab = event.target;
        selectPage(tab.dataset.tab);
        changeTab(tab);
    });
    if (tabs[i].classList.contains('active')) {
        selectPage(tabs[i].dataset.tab);
    }
}

Но в итоге пришлось сделать это, чтобы заставить его работать:

// add event listeners to tabs
for (i=0;i<tabs.length;i++) {
    tabs[i].addEventListener('click', function(event) {
        var tab = event.target;
        selectPage(tab.dataset.tab);
        changeTab(tab);
    });
}
// find active class and set page
for (i=0;i<tabs.length;i++) {
  if (tabs[i].classList.contains('active')) {
     selectPage(tabs[i].dataset.tab);
  }
}

Вот ссылка на Fiddle

Заранее спасибо за любую помощь, я чувствую, что здесь есть кое-что принципиальное, чего я не понимаю. Спасибо

0
halfacreyum 31 Дек 2017 в 05:23

2 ответа

Лучший ответ

Урок 0: используйте ESLint или аналогичные инструменты, чтобы проверить свой код на тривиальные ошибки, прежде чем проводить здесь бессонные ночи на SO и / или в средствах отладки.

Урок 1: локализуйте свои переменные.

Ваша проблема связана с глобальной переменной i, поэтому она повторно используется как вашим глобальным кодом, так и функцией selectPage. Последний устанавливает свое значение на tabs.length, преждевременно завершая цикл.

Просто замените i = 0 на var i = 0 в каждом выражении for.

1
raina77ow 31 Дек 2017 в 02:39

Попробуйте объявить переменную x с помощью let.

// add event listeners to tabs
for (let i=0;i<tabs.length;i++) {
    tabs[i].addEventListener('click', function(event) {
    var tab = event.target;
    selectPage(tab.dataset.tab);
    changeTab(tab);
  });
  if (tabs[i].classList.contains('active')) {
    selectPage(tabs[i].dataset.tab);
  }
}
1
HelloWorldPeace 31 Дек 2017 в 02:49