通过点击按钮实现Div块在显示状态与隐藏状态之间来回切换。
代码如下:
方法一:
<!DOCTYPE html><html><head><script src="/jquery/jquery-1.11.1.min.js"></script><script type="text/javascript">$(document).ready(function() {$("button").click(function() {$("#div1").toggle();});});</script></head><body><h3>点击按钮显示或隐藏Div块</h3><button type="button">按钮</button><div id="div1" style="border:2px solid #ff0000">再点击一下按钮我就会隐藏起来.</div></body></html>
方法二:
<!DOCTYPE html><html><head><script src="/jquery/jquery-1.11.1.min.js"></script><script type="text/javascript">function showOrHide(){var div = $("#div1").get(0);if(div.style.display == ""){div.style.display = "none";}else{div.style.display = "";}}</script></head><body><h3>点击按钮显示或隐藏Div块</h3><button οnclick="showOrHide()" type="button">按钮</button><div id="div1" style="display: none;border:2px solid #ff0000;">再点击一下按钮我就会隐藏起来.</div></body></html>
效果如下: