HTML帮助 - 隐藏按钮

时间:2011-08-24 21:42:30

标签: html

我的HTML样式需要帮助。

这是HTML代码:

<div id="hidden" style="display: none;">
    <label>URL:</label>
    <input type="text" name="url" size="50"/><br/>
    <input type="button" id="button2" value="Update"/> <br/>
</div>
<input type="button" id="button1" value ="Get Info" 
    onclick="document.getElementById('hidden').style.display = '';" size="25"/>

如您所见,点击<div></div>后会显示button1内的所有元素(最初会隐藏它们)。

我想要的是,除了显示的所有其他字段(包括按钮2)之外,点击button1时,button1将被隐藏。

我该怎么做?

2 个答案:

答案 0 :(得分:1)

更改

onclick="document.getElementById('hidden').style.display = '';"

onclick="document.getElementById('hidden').style.display = ''; this.style.display = 'none'"

您可以在此处查看此操作:http://jsfiddle.net/nayish/sJ5RR/

答案 1 :(得分:0)

而不是''将其更改为'Block'

这样:

<input type="button" id="button1" value ="Get Info"
onclick="document.getElementById('hidden').style.display = 'Block';" size="25"/>

但最好的方法是外化你的脚本,这样你就可以做更多的事情而不会弄乱你的HTML

var btn = document.getElementById('button1');
btn.onclick = function () {
   // all the stuff you want to do 
   document.getElementById('hidden').style.display = "block";
   this.style.display = "none";
   ... more stuff ...
}