Как использовать событие onclick изображения - PullRequest
Новая
       0

Как использовать событие onclick изображения

0 голосов
/ 07 января 2019

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

<body>
<div> 
  <img onclick="click()" src="http://chittagongit.com//images/smile-icon/smile-icon-6.jpg" id="smile">
</div>
<script>
  function click () {
    document.getElementByID("smile").src = "http://chittagongit.com//images/smile-icon/smile-icon-5.jpg"
  }
</script>

Тот же код в коде ручки: https://codepen.io/szczypkamaciek/project/editor/DBrPbw

Спасибо за помощь !!!

Ответы [ 3 ]

0 голосов
/ 07 января 2019

Ошибка document.getElementById Id не с большой буквы ID

function click() {
    document.getElementById("smile").src = "http://chittagongit.com//images/smile-icon/smile-icon-5.jpg"
}
0 голосов
/ 07 января 2019

В этом коде есть две проблемы:

  1. Неправильный getElementById (вставленный в getElementByID)
  2. Ваш код не может работать в этой форме, потому что вы используете click() в качестве имени вашей функции. Использование click таким образом вызовет событие щелчка, а не вашу функцию - вы можете прочитать больше здесь: click () в JS

В любом случае, в общем случае лучше использовать слушатели вместо прямого объявления узла.

0 голосов
/ 07 января 2019

Обязательно проверьте консоль, когда все работает так, как вы ожидаете. Вы неправильно написали "getElementByID", это должно быть "getElementById" (строчная буква "d").

Также обычно рекомендуется использовать addEventListener: 

<script>
  var smile = document.getElementById("smile");
  smile.addEventListener('click', function () {
    smile.src = "http://chittagongit.com//images/smile-icon/smile-icon-5.jpg"
  });
</script>
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...