如何解决将单击的元素传递给函数
按钮 2 没有按预期工作(像按钮 1 一样更新它的文本)。 “this”不是指按钮元素,而是指窗口。如何修复按钮 2?谢谢
<button id="btn1">Click me 1</button>
<button id="btn2">Click me 2</button>
<script>
var btn1 = document.getElementById("btn1");
var btn2 = document.getElementById("btn2");
btn1.addEventListener("click",function() {
this.innerText = "Come on";
});
btn2.addEventListener("click",changeMyText(this));
function changeMyText(btn) {
btn.innerText = "Come on";
// console.log(btn);
//here I get the window object
//I expected the button
}
</script>
解决方法
您立即执行处理程序 - 删除 (this) 并使用 e.target
我也会改成 type="button"
<button type="button" id="btn1">Click me 1</button>
<button type="button" id="btn2">Click me 2</button>
<script>
var btn1 = document.getElementById("btn1");
var btn2 = document.getElementById("btn2");
btn1.addEventListener("click",function() {
this.innerText = "Come on";
});
btn2.addEventListener("click",changeMyText);
function changeMyText(e) {
e.target.innerText = "Come on";
}
</script>
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。