使用JavaScript更改DIV可见性

Question

编辑: 由于这个问题变得相当受欢迎，我将修复问题以使其成为可工作的代码示例。原始问题仍然列出，但代码是有效的。

我正在尝试在按下按钮后显示一个div，但这无法正常工作，有什么想法吗？

<form action="insert.php" method="POST" align="right" id="post_form">
<input type="button" value="click me" onClick="show()">
<div id="show_button">  fdsfds </div><br>
</form>

#show_button{
 visibility:hidden;
}

function show(){
  // alert("cheked the button - worked");
  document.getElementById("show_button").style.visibility= 'visible' ;
}

- antonpuz

---

你应该使用引号包裹id：document.getElementById("show_button")。 - Antony

@Antony 你说得很对，我的朋友，浪费了太多时间... 非常感谢，上帝保佑你。 - antonpuz

Answer 1

将你的CSS更改为：

#show_button{
 display: none
}

而你在你的Javascript中：

function show(){
  //alert("cheked the button - worked");
  document.getElementById('show_button').style.display= 'block' ;
}

- Dragos Rizescu

---

@DavidThomas 是的，我错过了那个，不过为了进一步参考，我已经更正了我的答案。 - Dragos Rizescu

Answer 2

拼写错误，请将 document.getElementById(show_button) 更改为 document.getElementById("show_button")

function show(){
  document.getElementById("show_button").style.visibility= "visible" ;
}

- Tamil Selvan C

---

你能否详细阐述一下这个答案？或许可以解释一下它会做什么？ - Kermit

Answer 3

尝试使用以下代码：

function show(){
  //alert("cheked the button - worked");
  document.getElementById("show_button").style.visibility= "visible" ;
}

或者

function show(){
  //alert("cheked the button - worked");
  document.getElementById(show_button).style.display= "inline" ;
}

- Arup Rakshit

Answer 4

document.getElementById(show_button) -: 语法错误，缺少引号 " "！

- sakthi

---

我没有在任何编辑器中尝试过那个。不管怎样，我使用 dreamweaver cs6。 - sakthi