Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 05.08.2022, 19:37
Аспирант
Отправить личное сообщение для Andy_kun Посмотреть профиль Найти все сообщения от Andy_kun
 
Регистрация: 05.08.2022
Сообщений: 64

Почему может не срабатывать событие Input ?
Добрый вечер,

Подскажите, почему может не срабатывать событие Input ?

Вот такой простой код:

{

//--------------------------------------------------------------------
function my_func_addEventListener(event)
    {
console.log(event);
    }

//--------------------------------------------------------------------




    
let element = document.getElementsByClassName("gLFyf gsfi")[0];
console.log(element);

    if(element == undefined)
    {
          alert("undefined");        
    }
else
    {
        element.addEventListener("input", my_func_addEventListener);   
    }

}


За поле ввода беру начальную страницу поиска. И на самой первой странице поиска - событие Input - срабатывает, функция my_func_addEventListener - вызывается.

Но, как только я нажму поиск и гугл перейдет на страницу выдачи результатов поиска, то этот код уже не работает - событие Input не срабатывает, хотя имя класса - тоже самое.


Не срабатывает даже:

let element = document.getElementsByClassName("gLFyf gsfi")[0];

    if(element == undefined)
    {
          alert("undefined");        
    }
else
    {
        element.value = "Hello";
    }




В чем может быть причина ?

Последний раз редактировалось Andy_kun, 05.08.2022 в 19:41.
Ответить с цитированием
  #2 (permalink)  
Старый 05.08.2022, 20:33
Профессор
Отправить личное сообщение для Nexus Посмотреть профиль Найти все сообщения от Nexus
 
Регистрация: 04.12.2012
Сообщений: 3,706

Сообщение от Andy_kun
В чем может быть причина ?
Элемент, скорее всего, не создает событие input и не имеет свойства value.
Ответить с цитированием
  #3 (permalink)  
Старый 05.08.2022, 20:50
Аспирант
Отправить личное сообщение для Andy_kun Посмотреть профиль Найти все сообщения от Andy_kun
 
Регистрация: 05.08.2022
Сообщений: 64

Сообщение от Nexus Посмотреть сообщение
Элемент, скорее всего, не создает событие input и не имеет свойства value.
А как же тогда сайт обрабатывает ввод и как хранит значение ?
Ответить с цитированием
  #4 (permalink)  
Старый 05.08.2022, 21:21
Профессор
Отправить личное сообщение для Nexus Посмотреть профиль Найти все сообщения от Nexus
 
Регистрация: 04.12.2012
Сообщений: 3,706

Andy_kun, на странице 2 элемента с классами «gLFyf» и «gsfi»: первый - div, второй - input.
Вы выбираете первый элемент, у которого нет ни события input, ни свойства value.

Замените
document.getElementsByClassName("gLFyf gsfi")[0]

на
document.querySelector('input.gLFyf.gsfi')
Ответить с цитированием
  #5 (permalink)  
Старый 05.08.2022, 21:24
Аватар для Aetae
Тлен
Отправить личное сообщение для Aetae Посмотреть профиль Найти все сообщения от Aetae
 
Регистрация: 02.01.2010
Сообщений: 6,480

Потому что элементов с таким классом на странице поиска внезапно 2:
console.log(document.getElementsByClassName("gLFyf gsfi").length)


Вообще, бессмысленно привязываться к именам класса которые явно являются результатом генерации. При любом следующем апдейте они изменятся.
Лучше привяжись к имени и типу:
document.querySelector('input[name="q"][type="text"]')
__________________
29375, 35

Последний раз редактировалось Aetae, 05.08.2022 в 21:29.
Ответить с цитированием
  #6 (permalink)  
Старый 05.08.2022, 21:29
Аспирант
Отправить личное сообщение для Andy_kun Посмотреть профиль Найти все сообщения от Andy_kun
 
Регистрация: 05.08.2022
Сообщений: 64

Сообщение от Nexus Посмотреть сообщение
Andy_kun, на странице 2 элемента с классами «gLFyf» и «gsfi»: первый - div, второй - input.
Вы выбираете первый элемент, у которого нет ни события input, ни свойства value.

Замените
document.getElementsByClassName("gLFyf gsfi")[0]

на
document.querySelector('input.gLFyf.gsfi')
Спасибо! Теперь понял.
Ответить с цитированием
  #7 (permalink)  
Старый 05.08.2022, 22:54
Аспирант
Отправить личное сообщение для Andy_kun Посмотреть профиль Найти все сообщения от Andy_kun
 
Регистрация: 05.08.2022
Сообщений: 64

Сообщение от Aetae Посмотреть сообщение
Потому что элементов с таким классом на странице поиска внезапно 2:
console.log(document.getElementsByClassName("gLFyf gsfi").length)


Вообще, бессмысленно привязываться к именам класса которые явно являются результатом генерации. При любом следующем апдейте они изменятся.
Лучше привяжись к имени и типу:
document.querySelector('input[name="q"][type="text"]')
Спасибо, не знал, что через .length - можно кол-во найденных .getElementsByClassName классов - узнать.
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
почему style.fontSize для input пустой Conus Элементы интерфейса 1 10.04.2016 15:27
При добавлении DOCTYPE "плывут" размеры input type=text Demath (X)HTML/CSS 4 08.07.2012 19:27
Почему может не работать mouseover после метода post/get vuler Общие вопросы Javascript 1 22.02.2012 13:28
Почему может не работать? lanzs Firefox/Mozilla 8 04.10.2010 23:15
Почему может не работать value в textarea Snipe Элементы интерфейса 2 24.02.2009 19:27