Question

可能重复：
Javascript show element on click

我跟随DIV。我想在点击按钮后显示DIV。现在显示无

<div  style="display:none;" class="answer_list" > WELCOME</div>
<input type="button" name="answer" >

Answer 1

HTML代码：

<div id="welcomeDiv"  style="display:none;" class="answer_list" > WELCOME</div>
<input type="button" name="answer" value="Show Div" onclick="showDiv()" />

Javascript：

function showDiv() {
   document.getElementById('welcomeDiv').style.display = "block";
}

参见演示：http://jsfiddle.net/rathoreahsan/vzmnJ/

Answer 2

<强> HTML

<div id="myDiv" style="display:none;" class="answer_list" >WELCOME</div>
<input type="button" name="answer" onclick="ShowDiv()" />

<强>的JavaScript

function ShowDiv() {
    document.getElementById("myDiv").style.display = "";
}

或者如果你想使用带有漂亮小动画的jQuery：

<input id="myButton" type="button" name="answer" />

$('#myButton').click(function() {
  $('#myDiv').toggle('slow', function() {
    // Animation complete.
  });
});

Answer 3

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

<input type="button" name="answer" onclick="showDiv('toggle')">Show</input>

<div id="toggle" style="display:none">Hello</div>

Answer 4

<div  style="display:none;" class="answer_list" > WELCOME</div>
<input type="button" name="answer" onclick="document.getElementsByClassName('answer_list')[0].style.display = 'auto';">

单击Javascript中的按钮后如何显示div？

4 个答案: