Внешний JavaScript onclick вместо встроенного HTML onclick

#javascript #html #onclick

#javascript #HTML #onclick

Вопрос:

Я новичок в JavaScript, и мне нужна помощь с моим кодом. Я сделал небольшую историю о гонках на болиде формулы-1 против Михаэля Шумахера.

В этой игре вы могли выбрать свой автомобиль, нажав на изображение, а затем продолжить, но мой учитель сказал, что этого недостаточно. Она дала мне отзыв и сказала, что мне нужно вставить HTML img onclick в мой JavaScript.

Я не знаю, что делать и куда его поместить.

Комментарии:

1. developer.mozilla.org/en-US/docs/Web/API/…

2. кроме того, это ссылка на мой код oege.ie.hva.nl /~felthud001/dt3/index.html

3. Ваш учитель не научил вас этому, или вы должны исследовать это самостоятельно? Какой именно была обратная связь? И, серьезно, это образование на уровне колледжа?

4. ну, это основной материал. Я хотел это сделать. Я из Нидерландов, и это первый класс многих Javascript. В будущем мы получим Javascript 2 и 3, где он становится более продвинутым. Мой учитель сказал: нет, неправильно вставлять Javascript в HTML-файл. Я хочу, чтобы он был внешним (в файле js). Поэтому я начал искать решения, но не нашел, и это могло бы помочь мне решить эту проблему…

Ответ №1:

Сначала добавьте атрибут id в свой тег изображения, например,

 <img id='car1'/>
 

или

 <img id='car2'/>
 

затем используйте метод addEventListener для добавления прослушивателя событий, например:

 document.getElementById('car1').addEventListener('click', functionName, false);
document.getElementById('car2').addEventListener('click', functionName, false);
 

Эта функция принимает 3 аргумента, первый — это тип события (щелчок), второй — имя функции, которую вы хотите вызвать, а третий — способ захвата события (просто оставьте это как false). Затем создайте в своем javascript функцию с именем onPageLoad и поместите в нее две строки кода:

 function onPageLoad(){
    document.getElementById('car1').addEventListener('click', functionName, false);
    document.getElementById('car2').addEventListener('click', functionName, false);
}
 

Наконец, добавьте эту строку кода в конец страницы, чтобы запустить весь процесс:

 window.addEventListener('DOMContentLoaded', onPageLoad, false);
 

Комментарии:

1. видите ли, я не сомневаюсь, что ваш код не будет работать, но я такой новичок в Javascript, что понятия не имею, куда его поместить … извините

2. Просто добавьте его в начало вашего документа либо между тегами скрипта, либо во внешний файл javascript.