addEventListener 方法无法正常工作
[英]addEventListener method is not working properly
问题描述
I am building simple counter application and in Javascript addEventListern is not working giving this error:
我正在构建简单的计数器应用程序，并且在 Javascript 中addEventListern无法正常工作，出现此错误：
Here is my JavaScript Code which i tried but it still gives error of这是我尝试过的 JavaScript 代码，但它仍然给出错误
Cannot read property 'addEventLister' of Null
//selecting elements let value = document.getElementById('value'); let counter = 0; value.textContent = counter; // addingEventListener document.getElementById('reset').addEventListener('click', reset); document.getElementById('increase').addEventListener('click', increase); document.getElementById('decrease').addEventListener('click', decrease); // Event functions function reset() { counter = 0; } function increase() { counter++; } function decrease() { counter--; }
<,DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width. initial-scale=1.0"> <title>Document</title> </head> <body> <div id="main"> <div class="container"> <p class="two-times">Counter</p> <p class="two-times" id="value">0</p> <div class="buttons"> <input class="btn" id="decrease" type="button" value="Recrease"> <input class="btn" id="reset" type="button" value="Reset"> <input class="btn" id="Increase" type="button" value="Increase"> </div> </div> </div> <!-- javaScript --> <script src="app.js"></script> </body> </html>
2 个解决方案
解决方案1
1 已采纳 2020-08-05 13:59:54
document.getElementById('increase').addEventListener('click', increase);
And和
<input class="btn" id="Increase" type="button" value="Increase">
Don't match不匹配
//selecting elements let value = document.getElementById('value'); let counter = 0; value.textContent = counter; // addingEventListener document.getElementById('reset').addEventListener('click', reset); document.getElementById('Increase').addEventListener('click', increase); document.getElementById('decrease').addEventListener('click', decrease); // Event functions function reset() { counter = 0; } function increase() { counter++; } function decrease() { counter--; }
<,DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width. initial-scale=1.0"> <title>Document</title> </head> <body> <div id="main"> <div class="container"> <p class="two-times">Counter</p> <p class="two-times" id="value">0</p> <div class="buttons"> <input class="btn" id="decrease" type="button" value="Recrease"> <input class="btn" id="reset" type="button" value="Reset"> <input class="btn" id="Increase" type="button" value="Increase"> </div> </div> </div> <!-- javaScript --> <script src="app.js"></script> </body> </html>
解决方案2
1 2020-08-05 14:04:30
You have a typo.你有一个错字。 The input element has an ID with uppercase (Increase) and you are trying to access it with the lowercase name (increase).输入元素的 ID 为大写（Increase），您尝试使用小写名称（increase）访问它。
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.
相关问题
addEventListener =方法中的功能不起作用 - addEventListener = function in method not working
addeventlistener仅在chrome中无法正常工作 - addeventlistener not working properly only in chrome
addEventListener（“ load”）在Chrome中无法正常工作？ - addEventListener(“load”) not working properly in Chrome?
addEventListener无法正常工作 - addEventListener isn't working properly
document.addEventListener(“click”) 无法正常工作 - document.addEventListener(“click”) not working properly
addEventListener和attachEvent如何工作？ Keydown和Keyup不能正常工作 - How do addEventListener and attachEvent works? Keydown and Keyup is not working properly
addEventListener 'submit' 在单击按钮时正常工作，但在按 Enter 时不能正常工作 - addEventListener 'submit' working properly when clicking on button but not when pressing enter
addEventListener（）不起作用 - addEventListener() not working
.addEventListener不起作用 - .addEventListener not working
addeventlistener不起作用 - addeventlistener not working
相关标签