Blind with jQuery

问题:

I'm trying to write a blind function that would close a DIV in a display:none mode. The unseen DIV is inside a wider DIV, containing the blind trigger.

This:

        $(document).ready(function(){
            $("#toggle_blind").click(function () {
            $(this).toggle("fast");
            });
        });

Well, this blinds the button. How can I add a DIV to $this? Something like:

<div id="blind" class="wider_div">
   <h3 id="closeButton">Close</h3>
   <div style="display:none;" id="closeThis">
       <p>some text</p>
   </div>
</div>

How do I make the Close Button on H3 to close/open the CloseButton DIV on each click?

Thank you!

回答1:

The div is the next sibling of the h3 so you can use .next()

E.g

$('#closeButton').click( function(){
  $(this).next().toggle();
});

回答2:

Reference the div directly, you may put something else in between it and the h3.

$(document).ready(function()
{
    $("#closeButton").click(function()
    {
        $("#closeThis").toggle("fast");
    });
});