JavaScript隐藏/显示元素 [英] JavaScript hide/show element

问题描述

按下它后，我怎么能隐藏'编辑'链接？当我按下编辑时，我还可以隐藏lorem ipsum文本吗？

 < script type =text / javascript > 
函数showStuff（id）{
 document.getElementById（id）.style.display ='block'; 
} 
< / script> 
 
 
< td class =post> 
 
< a href =＃onclick =showStuff（'answer1'）; return false;> Edit< / a> 
< span id =answer1style =display：none;> 
< textarea rows =10cols =115>< / textarea> 
< / span> 
 
 Lorem ipsum Lorem ipsum Lorem ipsum Lorem ipsum 
< / td> 
  

解决方案

<预类=片段码-JS郎-JS prettyprint-覆盖> function showStuff（id，text，btn）{document.getElementById（id）.style.display ='block'; //隐藏lorem ipsum text document.getElementById（text）.style.display ='none'; //隐藏链接btn.style.display ='none';}

 < TD类= POST >< A HREF = ＃ 的onclick = showStuff（ 'ANSWER1'， '文本1'，这一点）;返回false; >编辑< / A>< ;跨度ID = ANSWER1 风格= 显示：无; >< textarea的行数= 10 COLS = 115 >< / textarea的>< /跨度><跨度ID = 文本1 > Lorem ipsum Lorem ipsum Lorem ipsum Lorem ipsum< / span>< / td>  

How could I hide the 'Edit'-link after I press it? and also can I hide the "lorem ipsum" text when I press edit?

<script type="text/javascript">
function showStuff(id) {
    document.getElementById(id).style.display = 'block';
}
</script>


<td class="post">

<a href="#" onclick="showStuff('answer1'); return false;">Edit</a>
<span id="answer1" style="display: none;">
<textarea rows="10" cols="115"></textarea>
</span>

Lorem ipsum Lorem ipsum Lorem ipsum Lorem ipsum 
</td>

解决方案

function showStuff(id, text, btn) {
    document.getElementById(id).style.display = 'block';
    // hide the lorem ipsum text
    document.getElementById(text).style.display = 'none';
    // hide the link
    btn.style.display = 'none';
}

<td class="post">

<a href="#" onclick="showStuff('answer1', 'text1', this); return false;">Edit</a>
<span id="answer1" style="display: none;">
<textarea rows="10" cols="115"></textarea>
</span>

<span id="text1">Lorem ipsum Lorem ipsum Lorem ipsum Lorem ipsum</span>
</td>

这篇关于JavaScript隐藏/显示元素的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！