javascript - 根据使用 jquery 的按钮隐藏和显示 div

Question

我需要根据使用 html 和 jquert 的按钮来隐藏和调整 div

是按钮名称=显示状态我单击按钮更改为名称=隐藏并显示div，同样的功能也相反

Answer 1

You could do something like this (Note the custom display attribute):

$("#btn").click(function() {
   var item = $("input[name=yourInput]");

   if (item.attr("display")) {
      item.show();
      item.attr("display", false);
   } else {
        item.hide();
        item.attr("display", true);
    }
});

<input name="yourInput" display="true" />

http://jsfiddle.net/Jrz5Y/1/

Answer 2

您可以创建一个设置为默认值的布尔变量，并在您单击按钮时将其更改为反向值。

根据布尔值的状态，您可以在方法中执行正确的路径

Answer 3

你可以用这个

<script src="Scripts/jquery-1.4.1.js" type="text/javascript"></script>
    <script type="text/javascript">

    function ShowHide()
    {
            if ($("#divdata").css('display') == 'none'){
            $("#divdata").show();
            $("#btnClick").val("Hide");
        }
        else{
            $("#divdata").hide();
            $("#btnClick").val("Show Status");
        }
}

</script>

你的 div 会是这样的。

<div id="divdata" style="display:none">
I have to show and hide this div.
</div>

按钮将是这样的。

<input id="btnClick" type="button" value="Show Status"   onclick="ShowHide()" />

我希望它会起作用。