Javascript 事件侦听器未在单击时触发
我正在创建一个简单的函数来关闭一个flash message div on click事件,但我的侦听器没有启动 我写了3个不同的函数试图让它工作,但什么都没有发生,Chrome控制台也没有告诉我任何事情 我的第一堂课是ES6课,这堂课:Javascript 事件侦听器未在单击时触发,javascript,event-handling,Javascript,Event Handling,我正在创建一个简单的函数来关闭一个flash message div on click事件,但我的侦听器没有启动 我写了3个不同的函数试图让它工作,但什么都没有发生,Chrome控制台也没有告诉我任何事情 我的第一堂课是ES6课,这堂课: class closeFlashMessages { constructor () { this.getFlashMessages = document.querySelector("#flash-messages"); this.add
class closeFlashMessages {
constructor () {
this.getFlashMessages = document.querySelector("#flash-messages");
this.addEventListeners();
}
close () {
console.log(this.getFlashMessages);
this.getFlashMessages.className = "hide";
}
addEventListeners () {
if(this.getFlashMessages)
this.getFlashMessages.addEventListener("click", this.close);
}
}
new closeFlashMessages();
我的第二个想法是:
(function (){
let getFlashMessages = document.querySelector("#flash-messages");
function close () {
console.log(getFlashMessages);
getFlashMessages.className = "hide";
}
function addEventListeners () {
getFlashMessages.addEventListener("click", function () {
close()
});
}
addEventListeners();
});
最后一个是:
(function (){
let getFlashMessages = document.getElementById("flash-messages");
getFlashMessages.addEventListener("click", close(getFlashMessages));
function close (id) {
console.log(getFlashMessages);
getFlashMessages.className = "hide";
}
});
我的HTML:
<div id="flash-messages">
<div class="flash success">
<p>Recept byl přidán do nákupního seznamu.</p>
</div>
</div>
接受拜尔·皮丹·多纳库普尼霍·塞兹纳姆的采访
但是他们都没有成功!!我不明白
对于前两个问题,我的
这个问题没有定义。getFlashMessages
也不确定原因。我对ES6不太熟悉
但如果我在javascript上尝试类似的代码示例,它将如下所示,我希望它在ES6中也几乎类似
var getFlashMessages = document.getElementById("flash-messages");
getFlashMessages.addEventListener("click", function()
{
clicked(getFlashMessages);
});
function clicked(id){
console.log(id);
id.className = "hide";
}
在这里,我调用匿名函数,它的默认参数将是中给出的事件对象 我的解决方案不在ES6中
function Init(){
var id = document.getElementById('flash-messages');
var msg = document.querySelector('.flash');
id.addEventListener('click',function(){
msg.className = 'hide';
});
}
Init();
看这里