Question

我的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将被隐藏。

我该怎么做？

Answer 1

更改

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

到

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

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

Answer 2

而不是''将其更改为'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 ...
}

HTML帮助 - 隐藏按钮

2 个答案: