Блог

Главная - Вопросы по программированию - Доступ к переменным внутри Eventlisteners — ванильный JavaScript

Доступ к переменным внутри Eventlisteners — ванильный JavaScript

#javascript

#javascript

Вопрос:

У меня есть 2 divs с одинаковым классом, но разным textContent, я хочу извлечь его значение с помощью eventListners и передать его в качестве аргумента другой функции

Html-код

 <div class = "seasonDeatils__container">
 <p class = "seasonYear ">2020</p>
</div>
<div class = "seasonDeatils__container">
 <p class = "seasonYear ">2019</p>
</div>

Код JavaScript, который я пробовал

 var season;
const getSeasonYear = document.querySelectorAll('.seasonDeatils__container');
getSeasonYear.forEach((el)=>{
   el.addEventListener('click', ()=>{
   season =  el.firstElementChild.textContent;
    })
})

//I now want to access the 'season' value elsewhere in the code

Ответ №1:

Просто передайте значение season в качестве аргумента из самой функции прослушивателя кликов в функцию в другом месте вашего кода следующим образом:

 var season;
const getSeasonYear = document.querySelectorAll('.seasonDeatils__container');

getSeasonYear.forEach((el)=>{
   el.addEventListener('click', ()=>{
     season =  el.firstElementChild.textContent;
     someOtherFunction(season);
   })
})

someOtherFunction = x => {
    console.log(x);
    alert(x);
}  
 <div class = "seasonDeatils__container">
 <p class = "seasonYear ">2020</p>
</div>
<div class = "seasonDeatils__container">
 <p class = "seasonYear ">2019</p>
</div>

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

1. У меня есть еще одно сомнение по этому поводу, что, если я хочу получить доступ к значению сезона за пределами этого для каждой функции и обновлять значение при каждом нажатии ?.

2. В приведенном выше фрагменте аргумент, который вы передаете, обновляется каждый раз, когда вы нажимаете. Запустите приведенный выше фрагмент и сначала нажмите 2019, а затем нажмите 2020, чтобы понять, что я имею в виду.

3. Да, я понял, я хочу спросить var season; const getSeasonYear = document . querySelectorAll(‘.seasonDeatils__container’); getSeasonYear.forEach((el)=>{ el.addEventListener(‘click’, ()=>{ season = el.firstElementChild.textContent; someOtherFunction(season); }) })` В этом коде я получаю значение сезона, я хочу передать его в новый файл и сохранить там как переменную, возможно ли это?