Jquery面板显示和单击按钮时隐藏 [英] Jquery Panel display and Hide on click of a button

问题描述

嗨朋友们，



我是Jquery的新手，我要求点击面板必须显示的按钮，如果我点击它必须隐藏相同的按钮。

我可以在点击时显示面板，但现在我想通过点击相同的按钮再次隐藏面板。

Hi friends,

I am new to Jquery, I have a requirement of on click of a button the panel has to display and again if i click on the same button it has to hide.
I am able to display the panel on click , but now i want to hide the panel again by clicking on the same button.

推荐答案

如果你想在同一个按钮上显示和隐藏面板，那么你需要切换面板。

代码如下所示。



HTML

If you want to show and hide the panel on the same button, then you need toggle the panel.
Code will be like below.

HTML

<div id='panel'>[Put your content here]</div>
<input type="button" id='click' value="show/hide" />

CSS

CSS

#panel
{
     height: 200px;
     width: 200px;
     background: #E88C37;
     float: left;
     display: none;
     font-size: xx-large;
}

Javascript

Javascript

（' ＃click'）。click（ function （）
{

('#click').click(function() {

（ ＃面板）切换（）;
}）;

("#panel").toggle(); });

看看现场演示 [ ^ ]。



谢谢......

Have a look at the Live Demo[^].

Thanks...

这篇关于Jquery面板显示和单击按钮时隐藏的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！