Причина ошибки скрытия подсказки?

Question

[Nikita Shchypylov]

Всем привет

Есть код, который, по идее, должен скрывать подсказку через пол секунды после её появления на сайте. Вот мой код сейчас :

/**
 * Hiding tooltips
 */

function hideTooltip() {
	if (document.getElementById('tooltip_input')) {
		var tool = document.getElementById('tooltip_input');
		setTimeout(function () { 
			tool.classList.remove('open')
		}, 500)
	}
}

Вроде как все хорошо, но он не забирает класс у подсказки. Консоль "как воды в рот набрала"

Answer 1

[Виталий]

В тот момент когда в ваша анонимная функция начинает исполнение, функция Хайдтултип уже закончила свою работу и все переменные удалены. Попробуйте перенести var tool = document.getElementById('tooltip_input'); в тело анонимной функции.

Comments

[M-ka]

Нет, не в этом проблема....
Куда банальнее, ай ди просто не существует в момент запуска hideTooltip...
Если выполнить эту ф-ю, предварительно заменив tool.classList.remove('open') на консоль лог тул, если ай ди существует, то выкинет в консоль.... что и можно наблюдать
Можно опробовать в консоле
(function (){
if (document.getElementById('myID')) {
var tool = document.getElementById('myID');
setTimeout(function () {
console.log(tool) //link to tag
}, 500)
}
})()
Ну или такой вариант более краисвый:
(function (){
var tool = document.getElementById('myID');
if (tool) {
setTimeout(function () {
console.log(tool)
}, 500)
}
})()

Еще как вариант, проблема может быть в самом classList, он просто не поддерживается в том браузере, в котором смотрел автор... т.к. нужно проверять и добавлять его реализацию ну или не использовать вообще.

[M-ka]

Ну а еще можно setTimeout вынести в ф-ю, а еще можно изначально в ф-ю передавать ай ди в виде параметра или вообще сразу елемент

Answer 2

[display: block]

Функция hideTooltip дальше по коду вызывается? Попробуйте законсолить каждый шаг.

function hideTooltip() {
  console.log('run func');
  console.log(document.getElementById('tooltip_input'));
  if (document.getElementById('tooltip_input')) {
    console.log('if pass');
    var tool = document.getElementById('tooltip_input');
    setTimeout(function () {
      console.log('timeout callback');
      tool.classList.remove('open')
    }, 500)
  }
}

Comments

[Виталий]

Прочитайте мой ответ, там четко показано в чем беда.