TrueJS 32. AddEventListener - события

Поділитися
Вставка
  • Опубліковано 1 гру 2024

КОМЕНТАРІ • 174

  • @Skapomak
    @Skapomak 5 років тому +46

    Один из немногих лучших каналов по урокам javascript.

    • @itgid
      @itgid  5 років тому +1

      Спасибо!

    • @malytv1170
      @malytv1170 3 роки тому

      Здраствуйте! Стали front-end разработчиком?

    • @nostame.4246
      @nostame.4246 2 роки тому

      @@malytv1170 Здравствуйте! Стали фронтенд разработчиком?

  • @AnnaShashkina-m1r
    @AnnaShashkina-m1r 2 місяці тому

    Смотрю ваше видео спустя 5 лет. Огромное спасибо 🙌🏻 Все встало на свои места, стало понятно, как это работает. До вашего видео я уже стала приходить к мысли, что я очень глубоко гуманитарий, и все это явно не для меня🥲

  • @ИринаИрина-ш5ы7р
    @ИринаИрина-ш5ы7р 5 місяців тому

    Действительно грамотное истолкование(без грамма воды)!

  • @TONY_BERG_MINSK
    @TONY_BERG_MINSK 3 роки тому +1

    Ты чертов Гений!!! Самая лучшая подача в интернет! Ставлю лайк!

  • @Snegurjan
    @Snegurjan 3 роки тому +7

    У вас определенно таллант преподователя,не бросайте это дело,спасибо за труды!!!

  • @ОлександрКовальчук-й9е

    молодець. дякую за пояснення.
    дійсно, вмієш доступно і зрозуміло пояснити!

  • @selfmotivation1337
    @selfmotivation1337 4 роки тому

    Спасибо большое за урок. Объясняете шикарно - доступно, притом подробно, но лаконично. Огонь!

  • @ОксанаХарченко-д9г

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

  • @МаксимЧ-к9я
    @МаксимЧ-к9я 2 роки тому

    Класс, все понятно и без лишней инфы

  • @vitaercx
    @vitaercx 4 роки тому

    Спасибо очень доходчиво и понятно! Про опции упоминание очень пригодилось. Была функция, которая копировала текст из таблицы в строчку по клику кнопки. Но каждый раз функция выполнялась вновь и вновь при клике, происходило дублирование. Элегантное решение опции { once: true } в AddEventListener решило проблему.

  • @НатальяЦаренкова-к6з

    Дуже Вам вдячна! Це перше відео, де так стисло та доступно про AddEventListener

  • @zoyapleskatsevich9150
    @zoyapleskatsevich9150 5 років тому +13

    Нравятся ваши уроки! Спасибо! Очень ждем следующего урока о применении addEventListener и transition :)

    • @itgid
      @itgid  5 років тому +3

      Согласен, интересный пример!

  • @ЭдуардВорона-м1и
    @ЭдуардВорона-м1и 3 роки тому +1

    очень понравился курс

  • @nikospetsalakis9516
    @nikospetsalakis9516 4 роки тому

    Как же Вы все легко и понятно объясняете! Большое спасибо за Ваши уроки!

  • @shamilsalakhutdinov5519
    @shamilsalakhutdinov5519 4 роки тому

    ты просто лучший) так понятно объясняешь, все нравится, люблю тебя

  • @ПашаХодор-ш9о
    @ПашаХодор-ш9о 5 років тому

    Лучший канал, с подробным объяснение. Автору респект)

  • @Max-kr4ie
    @Max-kr4ie 5 років тому +3

    Спасибо очень полезно и интересно. И на данном этапе считаю уже пора разбирать более глубоко. Кто досмотрел до сюда уже не полный новичек и хотят развиваться и роста. Буду рад более детального разбора с высоты Вашего опыта .

    • @itgid
      @itgid  5 років тому +3

      это сложный вопрос. Увы канал не может рости со своими зрителями. В какой-то момент вы поймете что перешагнули этот уровень - нужно просто идти дальше. Это нормально.

  • @tririustenax1268
    @tririustenax1268 5 років тому +30

    Отличный урок, Спасибо! Лайкаем, комментим, ждем продолжения.

    • @itgid
      @itgid  5 років тому +2

      Спасибо большое. Будет.

    • @malytv1170
      @malytv1170 3 роки тому

      Здраствуйте! Стали front-end разработчиком?

  • @Alex-rs1tt
    @Alex-rs1tt 4 роки тому

    Спасибо огромное за уроки! Смотрю все видео, начал проходить Ваш JS2.0!!! Отличный курс!

  • @prometheusmusic4559
    @prometheusmusic4559 5 років тому +5

    Да, конечно! Интересно было бы послушать про кастомизацию
    Никогда не понимал, зачем addEventListener нужен, если событие можно просто в свойства записать. Спасибо, что разъяснили. Все ясно и понятно

    • @itgid
      @itgid  5 років тому +2

      Отлично, рад!

    • @malytv1170
      @malytv1170 3 роки тому

      Здраствуйте! Стали front-end разработчиком?

    • @yto4ka297
      @yto4ka297 3 роки тому

      @@malytv1170 Здравствуйте, а вы?

  • @pse1525
    @pse1525 4 роки тому

    Ну как же шикарно ты объясняешь! Это просто чудо какое то!

  • @volodymyrderunov6790
    @volodymyrderunov6790 5 років тому

    Спасибо за Ваши уроки! Вы отлично разъясняете.

  • @buyshark3838
    @buyshark3838 5 років тому

    урок и правда отличный
    очень хорошо, что показываете эволюцию языка и устаревшие варианты
    недостатки определенных методов
    жду следующие уроки с нетерпением

  • @ЮрійВовчук-е7ы
    @ЮрійВовчук-е7ы 4 роки тому

    Доступно пояснюєте, дякую!

  • @СергейРыженьков
    @СергейРыженьков 5 років тому

    очень всё доходчиво, спасибо за разъяснения, у вас дар к преподаванию, а то смотришь курсы некоторых товарищей: " здесь вот так вот , тут вот так вот"... а что откуда взялось , кто ж его разберёт... очень жду продолжения

  • @nataliaivaniv5308
    @nataliaivaniv5308 5 років тому

    Вы отлично разъяснили сложный материал , ждем следующего урока. Спасибо!

  • @Денчик85
    @Денчик85 3 роки тому

    Спасибо! Все ясно и доступно!

  • @annabegas8262
    @annabegas8262 5 років тому +1

    Спасибо за ваш труд. Очень ждем продолжения!

  • @СергійІльчишин-й7х
    @СергійІльчишин-й7х 5 років тому

    Супер! Будемо чекати продовження))) Дякуємо))

  • @Давид-п8и
    @Давид-п8и 5 років тому +9

    Спасибо за ваши старания!

    • @itgid
      @itgid  5 років тому +4

      Страдания!

    • @malytv1170
      @malytv1170 3 роки тому

      Здраствуйте! Стали front-end разработчиком?

  • @yuraprokopchuk7072
    @yuraprokopchuk7072 5 років тому +3

    Очень жду следующую часть)Спасибо за труды)

  • @glebpilipenka3060
    @glebpilipenka3060 4 роки тому

    Очень крутое объяснение, понял с первого просмотра, thx Александ!

  • @sea-lucky7143
    @sea-lucky7143 5 років тому +3

    Зашел на ура, ждем след выпуска. Спасибо!

    • @itgid
      @itgid  5 років тому +2

      супер!

    • @malytv1170
      @malytv1170 3 роки тому

      Здраствуйте! Стали front-end разработчиком?

    • @sea-lucky7143
      @sea-lucky7143 3 роки тому

      @@malytv1170 да)

    • @malytv1170
      @malytv1170 3 роки тому

      Джуниором?

    • @sea-lucky7143
      @sea-lucky7143 3 роки тому

      @@malytv1170 наверное уже ближе к middle чем junior... Ну опять же всё зависит от компании вы которой работаешь, ведь градация уровней разная, в моей компании как таковой нет, поэтому и однозначно не могу ответить на вопрос

  • @RobinGoodwe872
    @RobinGoodwe872 5 років тому

    Хороший урок, узнал много нового. Побольше бы уроков где разжевываются базовые инструменты.

  • @bagga_lev
    @bagga_lev 3 роки тому

    Огромнейшее вам спасибо! Великолепное объяснение, я наконец то понял эту тему, только благодаря вам =)

  • @vanyavasya6685
    @vanyavasya6685 4 роки тому

    Отличный урок, спасибо Вам !!!, Ставьте лайки ребята, поддержим лайками Алекса

  • @dmytrozahatin7173
    @dmytrozahatin7173 5 років тому +1

    Супер!Жду продолжения данной темы )

  • @Хорошийчеловек-с3л

    Отличный урок. Спасибо.

  • @KuKu_RuKu88
    @KuKu_RuKu88 4 роки тому

    Спасибо, супер - как всегда !!! Низкий поклон Вам

  • @ЕвгенийКочетков-ы8э

    Спасибо за подробное объяснение!

  • @КонстантинСуетин-ь8з

    Очень полезное видео, спасибо!

  • @kukusikibabasikitv
    @kukusikibabasikitv 4 роки тому

    Плюсик вам в карму! Спасибо

  • @viktorshatalov1920
    @viktorshatalov1920 4 роки тому

    Отличный урок.как раз такой искал

  • @ivanbag9741
    @ivanbag9741 3 роки тому

    Спасибо, Алекс!!!

  • @dimazub6069
    @dimazub6069 4 роки тому

    Спасибо! Урок был полезным!

  • @ВаноВано-л6р
    @ВаноВано-л6р 5 років тому +11

    Хороший урок, как продолжение отлично подойдёт тема: диспачера событий, событийного эмиттера.
    Было бы очень здорово развернуть тему промисов(в связке с async/await)и fetch-инга(как альтернативу шттпреквест), worklet-ов, worker-ов.
    Мне нравится ваша подача, смотрю, хоть материал для начинающих,но всегда есть что то новое подчеркнуть.

    • @itgid
      @itgid  5 років тому +2

      наверное да, таких тем мало!

  • @gayanegalstyan9132
    @gayanegalstyan9132 3 роки тому

    Спасибо Вам огромное!!! Помогли!

  • @HappyLifege
    @HappyLifege 5 років тому +2

    За продолжение темы!

    • @itgid
      @itgid  5 років тому +1

      отлично!

  • @_man-in-space_
    @_man-in-space_ 5 років тому +5

    Сразу лайк!)

  • @ramanmatveyenka8396
    @ramanmatveyenka8396 3 роки тому

    Хорошо объяснили, спасибо

  • @alllligator
    @alllligator 2 роки тому

    Спасибо за видео!

  • @deepseapics
    @deepseapics 5 років тому +1

    Спасибо за видео, жду продолжения :)

    • @itgid
      @itgid  5 років тому +1

      Буде, спасибо!

  • @oj5968
    @oj5968 5 років тому

    Лучший. Спасибо огромное!

  • @angrybeaver3425
    @angrybeaver3425 5 років тому +1

    Продолжайте!

  • @dougrattman8284
    @dougrattman8284 3 роки тому

    Очень помогло, спасибо!

  • @ndreiorekhov777
    @ndreiorekhov777 5 років тому +4

    Страшный объект this - шутка зашла норм :-)
    Урок норм, ...парочку мыслей скажу появившихся при просмотре - по возможности показать как и где можно реализовать в реальном проекте, на примере, ...и второе если возможно немного увеличить шрифт написания кода, ...само собой без этого достаточно информативно, спс.

    • @itgid
      @itgid  5 років тому +1

      Спасибо, сделаем!

  • @muhtoryusufjanov3946
    @muhtoryusufjanov3946 5 років тому +1

    спасибо за уроки... да очень интересна тема честно говоря хотел просить сделает уроки о событие с вами интерестно и понятно

    • @itgid
      @itgid  5 років тому +1

      спасибо за комментарий

  • @nikolay6143
    @nikolay6143 3 роки тому

    Спасибо, хороший урок

  • @valentynlugovyi4789
    @valentynlugovyi4789 4 роки тому

    Более менее понятно. Благодарю!

  • @nicknameis
    @nicknameis 4 роки тому

    Спасибо! Хочу больше детального разбора eventlistener.

  • @dmitrijponkin
    @dmitrijponkin 5 років тому

    Спасибо! Супер :) ждем продолжения)

  • @rmnkot
    @rmnkot 5 років тому +5

    в контексте ивентов я испльзую event.target или event.currentTarget вместо this, this больше используется в контексте функций конструкторов и классов ES6

  • @gamego6086
    @gamego6086 5 років тому

    Спасибо , продолжайте

  • @entity9069
    @entity9069 5 років тому +2

    Очень интересно :)))

  • @ПавелПолищук-б2ъ
    @ПавелПолищук-б2ъ 5 років тому +4

    Супер. Взял для себя много полезного. Дизлайкеры пусть попробуют сделать лучше

    • @itgid
      @itgid  5 років тому

      как всегда - делаешь - критикуют. Это нормально!

  • @АлександрКузнецов-ю7ф8м

    Все круто, спасибо

  • @Highlander3147
    @Highlander3147 5 років тому +8

    Уважаемый Алекс Лущенко! Хочу спросить совета, надеюсь найдете время для ответа. Мне 49!!!! лет. Анализ прожитых дней привел меня к выводу, что один из профессиональных навыков, который я "упустил" в жизни - программирование. И вот теперь, в "наказании" себя , я решил это исправить. С января этого года, не торопясь, изучаю тему. Могу сверстать несложные сайтики. Начал изучать JS, параллельно изучаю JQuery. Есть понимание , скажем так, о чем речь.( После просмотра Ваших уроков.) Самое главное - Я понял -ЭТО МОЕ. Более того - я могу монетизировать свои знания. То, что я доведу дело до приемлемого , профессионального ,уровня сомнений нет!!! Единственное, что меня остановит , исчерпание жизненного ресурса данного нам Всевышним. Моя программа минимум обязывает меня до конца этого года выйти на уровень знаний, достаточных для "прибавки к пенсии" скажем 30т.руб. Есть понимание в вопросе последовательности изучения технологий (веб разработка ) для достижение цели. (Работа на фрилансе). Но , так же , понятно , что в силу возраста, необходимо выбрать самый возможный короткий путь. То есть сконцентрироваться на самом необходимом для скорейшего старта в качестве фрилансера. Моя просьба звучит следующим образом: Вот если бы Вы стояли сегодня перед таким выбором, как бы Вы поступили, какие бы Вы выбрали технологии , предприняли шаги для достижения озвученной мной цели? На каком уровне необходимо владеть данными технологиями для СТАРТА? Как Вы , как специалист, оцениваете шансы на успех при таких стартовых позициях. Понимаю, какое количество людей я рассмешил написав данный текст, но написав это я лишь укрепился в своих намерениях добиться успеха. Желаю всем удачи.
    P.S. То обстоятельство, что подаваемый Вами материал усваивается мною на 95-99%. дало мне смелость обратиться к Вам с такой просьбой. В любом случае спасибо Вам за Ваши уроки. С уважением Yuber Roshe.

    • @ВладимирМестнник
      @ВладимирМестнник 5 років тому +1

      Я начал в 55 с PHP ,потом jQuery и js и по тихоньку делаю добавку к своей пенсии.Вы на правильном пути,удачи Вам!. Node.js вас ждет впереди.

    • @Highlander3147
      @Highlander3147 5 років тому

      @@ВладимирМестнник Спасибо. И Вам удачи!

    • @itgid
      @itgid  5 років тому +1

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

    • @Highlander3147
      @Highlander3147 5 років тому +1

      @@itgid Спасибо за дельный совет. Разведка боем. Что может быть лучше данного метода.

    • @dmytrolambru2984
      @dmytrolambru2984 5 років тому +1

      Все верно делаете, молодцы так держать! Пофиг на остальных, главное делайте то, что Вам нравится ;) Удачи Вам и сил.

  • @Nazar5545
    @Nazar5545 5 років тому +1

    супер!

  • @super_snejinka
    @super_snejinka 3 роки тому

    очень хорошее видео!!

  • @i1_gaming
    @i1_gaming 5 років тому

    1 Вопрос.
    Было оговорено о костыле с .onclick c анонимной функцией, но если я не хочу писать n-е количество строк для 1 события (например "click"), можно ли сделать похожий вариант как с анонимной функцией (.onclick) или все равно нужно будет писать 100500 строе для 1 елемента с использованием AddEventListener.
    2 Вопрос.
    Чем отличается getElementById(и ему подобные ByClassName и т.д.) и querySelector?

  • @iraklisalukvadze5814
    @iraklisalukvadze5814 5 років тому

    ამ კაცმა იცის თავისი საქმე!!!!!!!!

  • @novruzmehdiyev3413
    @novruzmehdiyev3413 5 років тому +3

    Вы Суперррр, как можно ставить дизлайк

    • @itgid
      @itgid  5 років тому

      Спасибо!

  • @dmitriyk.2462
    @dmitriyk.2462 5 років тому

    Хороший урок

  • @МихаилМастанов-ы5ы

    Круто!!!

  • @dreft1989
    @dreft1989 4 роки тому

    супер, спасибо

  • @АлександрШатохин-н7г

    Очень ждем продолжение

  • @r2r4ik
    @r2r4ik 5 років тому +1

    AddEventListener тоже функция!

  • @dmitriyart2989
    @dmitriyart2989 5 років тому

    спасибо большое

  • @АлексейЛысюк-ь4я
    @АлексейЛысюк-ь4я 4 роки тому +1

    Импонирует у автора, что он "делает" ошибки.
    Имхо навык поиска ошибок незаменим для программера.
    Я год назад начал втыкать в С,С++ и для меня было довольно сильным препятствием возникновение большого количества ошибок поначалу, которые ставили меня в тупик, потому что я не знал, что с ними делать. Настолько сильно, что терялось намерение продолжать. Однако поскольку вариантов не было и проект надо было продолжать то ...
    Когда же автор делает "ошибки" у обучаемого откладывается в памяти непроизвольно что, где, как. Обучаемый психологически подготавливается к возможности ошибок, пониманию возможности преодолевания подобных затруднений и ориентировочным местам их поиска.
    Не знаю насколько намеренно сие делается, однако лично мне импонирует.
    Плюс посмотрел несколько уроков и отчетливо осознал, что прямолинейный опыт изучения яваскрипта по справочнику команд не самый эффективный. В стандарте уже понареализовано много всяких помогалочек, которые сильно упрощают процесс. Надо только их знать.

    • @itgid
      @itgid  4 роки тому

      Алексей Лысюк я живой человек. И да делаю ошибки. Иногда специально. Иногда задумаюсь.

  • @Владислав-г8з4щ
    @Владислав-г8з4щ 3 роки тому

    Дякую!

  • @ЕгорЕгорович-д2т
    @ЕгорЕгорович-д2т 3 роки тому

    Лайкнул хочу изучать js

  • @izi9818
    @izi9818 4 роки тому

    Спасибо

  • @dmitriipanov4627
    @dmitriipanov4627 Рік тому

    Спасибо за урок) А еще вопрос. Можно ли, и если да, то как, по событию делать другое действие в HTML, например, создавать блок с полем ввода? Я совсем новичок и почти ничего не знаю)

  • @Мирэстетики-р1к
    @Мирэстетики-р1к 5 років тому

    Спасибо!!!

  • @КаринаЧ-н5е
    @КаринаЧ-н5е 2 роки тому

    Здравствуйте. Спасибо за объяснение. Но мне только не понятно. Почему для удаления события надо добавлять removeEventListener? Почему-бы просто не удалить саму строчку с addEventListener?

  • @kogram
    @kogram 3 роки тому

    Можно ли управлять событиями браузера вперед, назад (history.back(), history.forward())

  • @pivrock913
    @pivrock913 4 роки тому

    Добрый день! Не могу найти выпуски TrueJS c 27 по 31 и после 32. Они есть вообще?

  • @annalipower4830
    @annalipower4830 3 роки тому

    могу ошибаться, но onclick = "Hellofunction ()". там ставиться ставятся (круглые скобки) из-за привязки к анонимной функции, которая в свою очередь и делает вызов функции которая описана внутри onclick.

  • @alexdreamer11
    @alexdreamer11 3 роки тому

    Всё гуд

  • @eroskaeroska6921
    @eroskaeroska6921 3 роки тому

    По-настоящему нюанс, прямо нюанс-нюанс, о котором нужно было сказать - это ошибка "Cannot read property 'addEventListener' of null"

  • @AleksTrifonov
    @AleksTrifonov Рік тому

    8:00 У меня на вкладке Свойства нет свойств с приставкой "on". Это почему так? Вижу кучу других свойств, а свойств с приставкой "on" нет.

  • @lekca216
    @lekca216 5 років тому

    Я так понимаю еще одно важное отличие addEventListener от простого вешания событий это работа с клавиатурой? То есть можно просто передать первым аргументом "keydown", вторым ссылку на функцию с проверкой кода нажатой клавиши и всё. Есть ли другой способ? С удовольствием посмотрел бы вторую часть со всеми возможностями addEventListener, а не только про "click", но спасибо и за это, очень доходчиво)

  • @intv3061
    @intv3061 5 років тому +1

    Жалко что только один лайк можно поставить....

    • @itgid
      @itgid  5 років тому +1

      Сам страдаю от этих ограничений. Я бы себе все лайки поставил.

  • @fastik1475
    @fastik1475 4 роки тому

    Спасибо , долго искал хороший канал по js и вот он, но хотел спросить, сейчас propeties не работает, что делать?

  • @kapotonai
    @kapotonai 5 років тому +2

    Спасибо Александр.
    Есть на канале Гоши Дударя создание игры-раннера на JS.Смогли бы вы что-то подобное создать?

    • @itgid
      @itgid  5 років тому +2

      Мог бы, но игры не очень мне интересны. Возможно какие-то маленькие.

    • @kapotonai
      @kapotonai 5 років тому

      @@itgid часто сталкиваюсь с вопросом заказчика, о "нятигивании" верстки на шаблон Джумла.Можете записать на эту тему видео?

    • @kapotonai
      @kapotonai 5 років тому

      @@itgid также,хотелось бы узнать,как написать модуль для Джумла(допустим модуль оплаты)

  • @ja-rusyn
    @ja-rusyn 5 років тому

    Еще один из старых способов без потери ссылки на элемент:
    document.onclick = function() {
    var elem = window.event.srcElement;
    if (elem.id === 'h3') {
    console.log('hi');
    console.log(elem);
    }
    };

  • @jsb7239
    @jsb7239 4 роки тому

    Превосходный урок!👍 А будет продолжение?

  • @СергейСкрипка-ы9б
    @СергейСкрипка-ы9б 5 років тому

    Спасибо большое за урок! По поводу transition... мы все-таки можем повесить на данное событие нужную нам функцию не используя addEventListener. document.querySelector("#element").ontransitionend = function(){ ... }; Правда работает это не во всех браузерах, в Хроме например, что удивительно)
    И не могли бы вы прояснить момент по поводу дубляжей функций (21 минута)? Функция является объектом и доступ к ней осуществляется по ссылке. Почему в данном случае она копируется?
    Прогнал через цикл несколько элементов и присвоил событиям одну и ту же функцию. В итоге btn[0].onclick === btn[5].onclick // true
    Или нужно копать глубже?)

  • @matweyptushkin7697
    @matweyptushkin7697 4 роки тому

    а продолжение вышло???

  • @iliakolomiiets8881
    @iliakolomiiets8881 4 роки тому

    Ну лайк поставить не могу так как ответ на вопрос не нашел, но шаг к нему сделал и не один по этому коммент. А вопрос простой, данное видео показывает как работать с элементов: картинка текст и т.д., но что делать если элементов несколько, к примеру несколько фоток или заголовков и надо определить на какой\какую из них я кликнул, querySelector позволяет работать только с первым элементом, а querySelectorAll выдает ошибку.