好的,我会尽力解释的。
下面是我的代码:
HTML:
<div class="mobile-wrapper">
<div id="mobile" class="mobile">
<img src="assets/images/mobile-moments-away-img.png">
<img id="mobile-close-btn" class="mobile-close-btn" src="assets/images/mobile-close-button-img.png" onclick="handleClose(this)">
<img id="mobile-continue-btn" class="mobile-continue-btn" src="assets/images/mobile-continue-now-img.png">
</div>
</div>
JS:
const handleClose = (elem) => {
console.log(elem);
elem.style.display = "none";
};
因此,当前handclose函数当前隐藏元素,在本例中,它关闭具有onclick=“handleclose(this)
的图像。我需要的是,当我单击该图像时,它关闭mobile
类,而不是关闭该图像。因此,我不确定如何在使用this
的同时引用mobile
类。
我必须使用这个
,正如我也被要求的那样。因为我有和上面一样的HTML,但是用于不同的图像,因为JavaScript函数将为上面的HTML以及我有的不同图像做同样的事情。例如:我的handleclose函数将使用不同的元素,但做相同的事情,因此我使用this
。因此,我希望得到一些帮助,而不是被告知以不同的方式执行例如getElementById
,因为这不是我所需要的。
您可以使用.parentElement
引用父元素:
null
const handleClose = (elem) => {
elem.parentElement.style.display = "none";
};
<div class="mobile-wrapper">
<div id="mobile" class="mobile">
<img src="assets/images/mobile-moments-away-img.png">
<img id="mobile-close-btn" class="mobile-close-btn" src="assets/images/mobile-close-button-img.png" onclick="handleClose(this)">
<img id="mobile-continue-btn" class="mobile-continue-btn" src="assets/images/mobile-continue-now-img.png">
</div>
</div>