显示一个 div onclick 并隐藏触发它的图像 [英] Show a div onclick and hide the image that triggered it

问题描述

我想使用下面的代码在点击时显示一个隐藏的 div，但是当它显示时，我希望我用来触发它的图像消失.这是我目前所拥有的:

I would like to use the following code to display a hidden div onclick, but then when the it is displayed, I want the image that I used to trigger it to disappear. Here is what I have so far:

HTML:

<img src="Icons/note_add.png" onclick="show('comment')"/>&nbsp;&nbsp;<div id="comment" style="float:left;display:none;"><textarea name="textfield6" cols="30" rows="2" id="textfield4" class="text"></textarea>&nbsp;<a href="#" class="buttonintable">Submit</a></div>

JS:

function show(target){
document.getElementById(target).style.display = 'block';
}
function hide(target){
document.getElementById(target).style.display = 'none';
}

如何调整它以隐藏触发它的元素?

How do adjust this to hide the element that fired it?

推荐答案

Jimmy 的答案会起作用，但是要让它显示出来(我假设你想要那个)，你应该在图像标签中添加一个 id...以下应该工作.

Jimmy's answer will work, however to get it to show back up (I assume you want that) you should add an id to the image tag... The following should work.

<img id="clickMeId" src="Icons/note_add.png" onclick="show('comment')"/>&nbsp;&nbsp;<div id="comment" style="float:left;display:none;"><textarea name="textfield6" cols="30" rows="2" id="textfield4" class="text"></textarea>&nbsp;<a href="#" class="buttonintable">Submit</a></div>

function show(target){
document.getElementById(target).style.display = 'block';
document.getElementById("clickMeId").style.display = 'none';
}
function hide(target){
document.getElementById(target).style.display = 'none';
document.getElementById("clickMeId").style.display = 'block';
}

这篇关于显示一个 div onclick 并隐藏触发它的图像的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！