Важная информация
Показано с 1 по 4 из 4

Тема: Почему не меняется цвет div при наведении и нажатии мыши?

  1. #1 Почему не меняется цвет div при наведении и нажатии мыши? 
    Новичок
    Регистрация
    08.03.2018
    Сообщений
    1
    Сказал(а) спасибо
    0
    Поблагодарили 0 раз(а) в 0 сообщениях
    JavaScript Code:
    1. <!DOCTYPE html>
    2. <html>
    3. <head>
    4. <title></title>
    5. <script type="text/javascript">
    6. var x = document.getElementById('888');
    7. x.onMouseOver= function () {
    8. // body...
    9.  
    10.    x.style.backgroundColor="red";
    11. }
    12. x.onclick= function () {
    13. // body...
    14.  
    15.    x.style.backgroundColor="red";
    16. }
    17. </script>
    18. </head>
    19. <body >
    20. <div id="888"  style="background-color:#B0C4DE; height: 200px; width: 200px; float: left; margin: 0px " >
    21.  
    22. </div>
    23. </body>
    24. </html>

    Почему не меняется цвет?
    Ответить с цитированием  
     

  2. #2  
    Администратор Аватар для rovico
    Регистрация
    17.04.2014
    Адрес
    Ярославль
    Сообщений
    245
    Сказал(а) спасибо
    17
    Поблагодарили 287 раз(а) в 162 сообщениях
    Записей в блоге
    2
    Первое, что бросилось в глаза - id элемента html, названный числом. Цитата с htmlbook.ru: "Идентификатор должен обязательно начинаться с латинского символа и может содержать в себе латинские буквы (A–Z, a–z), цифры (0–9), символ дефиса (-) и подчеркивания (_). Использование русских букв в именах идентификатора недопустимо."

    Второе: Когда вы не используете jQuery, стоит пользоваться методом addEventListener

    см. пример реализации (случайно найденный в интернете) https://codepen.io/rinatoptimus/pen/JYVgKX

    см. статью "Вам не нужен jQuery!" https://blog.garstasio.com/you-dont-...ing-for-events
    Ответить с цитированием  
     

  3. 2 пользователя(ей) сказали cпасибо:

    >Quiet Snow< (12.03.2018), Free Admin (12.03.2018)

  4. #3  
    Новичок
    Регистрация
    02.06.2018
    Сообщений
    1
    Сказал(а) спасибо
    0
    Поблагодарили 0 раз(а) в 0 сообщениях
    Привет!
    Дабы не плодить лишних тем спрошу здесь)
    Кто-нибудь может популярно объяснить начинающему почему вот так вот работает?!
    JavaScript Code:
    1. function someFunc(){
    2. alert(document.getElementById("lol").value);
    3. }
    4. document.getElementById("btn").onclick = someFunc;


    А вот так уже нет?:
    JavaScript Code:
    1. var text = document.getElementById('lol').value;
    2. function someFunc(){
    3. alert(text);
    4. }
    5. document.getElementById("btn").onclick = someFunc;
    Ответить с цитированием  
     

  5. #4  
    Администратор Аватар для rovico
    Регистрация
    17.04.2014
    Адрес
    Ярославль
    Сообщений
    245
    Сказал(а) спасибо
    17
    Поблагодарили 287 раз(а) в 162 сообщениях
    Записей в блоге
    2
    Это потому, что во втором случае переменная text инициируется один раз при загрузке страницы и больше не меняется. А в первом случае вы читаете актуальное значение

    То есть Вот так работать будет:

    JavaScript Code:
    1. function getInputValue() {
    2.    return document.getElementById('lol').value;
    3. }
    4.  
    5. function someFunc(){
    6.    alert(getInputValue());
    7. }
    8. document.getElementById("btn").onclick = someFunc;
    Ответить с цитированием  
     

  6. 2 пользователя(ей) сказали cпасибо:

    >Quiet Snow< (05.06.2018), Free Admin (05.06.2018)

Информация о теме
Пользователи, просматривающие эту тему

Эту тему просматривают: 1 (пользователей: 0 , гостей: 1)

Похожие темы

  1. Ответов: 0
    Последнее сообщение: 22.03.2017, 16:50
  2. Цвет текста
    от Константин Камышев в разделе QBasic
    Ответов: 3
    Последнее сообщение: 09.07.2015, 04:59
  3. Ответов: 1
    Последнее сообщение: 04.09.2014, 23:32
  4. Ответов: 5
    Последнее сообщение: 17.06.2014, 23:40
  5. Ответов: 2
    Последнее сообщение: 20.10.2013, 23:18
Ваши права
  • Вы не можете создавать новые темы
  • Вы не можете отвечать в темах
  • Вы не можете прикреплять вложения
  • Вы не можете редактировать свои сообщения
  •