[英]addEventListener working in console but not working in JS
I have this code for a book library.我有这个图书馆的代码。 https://jsfiddle.net/j5mxws4n/
https://jsfiddle.net/j5mxws4n/
I'm at the point of working with the 'read' sign where I want to add an event on click to change the icon from tick to X. I can do it through google console but when I do it in JS, I get a null error which is kinda weird.我正在使用“阅读”标志,我想在点击时添加一个事件以将图标从刻度线更改为 X。我可以通过谷歌控制台来完成,但是当我在 JS 中执行此操作时,我得到一个null 错误,这有点奇怪。
the way I'm trying to do it it:我尝试这样做的方式:
document.querySelector('#sign).addEventListener('click', (e)=>{
if(e.target.innerHTML === '✔'){
e.target.innerHTML = 'X'}
else{
e.target.innerHTML = '✔'
})
I get a null error even if I just type:即使我只是输入,我也会收到空错误:
let sign = document.querySelector('#sign').textContent;
You want this你要这个
https://jsfiddle.net/mplungjan/h43ztr1k/ https://jsfiddle.net/mplungjan/h43ztr1k/
Also remember to preventDefault or the page will jump还要记得preventDefault 否则页面会跳转
document.querySelector('#book-list').addEventListener('click', (e)=>{
e.preventDefault();
let tgt = e.target, cls = e.target.classList;
console.log(cls)
if (cls.contains("delete")) tgt.closest("tr").remove()
else if (cls.contains("sign")) {
e.target.textContent = e.target.textContent === "✔" ? "𝗫":"✔";
}
})
//You forgot to add the closing '
document.querySelector('#sign).addEventListener('click', (e)=>{
This line should be written like this这一行应该这样写
document.querySelector('#sign').addEventListener('click', (e)=>{
document.querySelector('#sign').addEventListener('click', (e)=>{ if(e.target.innerHTML === '✔'){ e.target.innerHTML = 'X'} else{ e.target.innerHTML = '✔' }}) let sign = document.querySelector('#sign').textContent;
<h1>click on check icon </h1> <div id='sign'>✔</div>
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.