1

私はJavascriptが初めてです。私はこれを理解しようとしてきましたが、そうではないようです。だから私の質問は...

「1」を開いて「2」をクリックすると、「1」の下のコンテンツが折りたたまれるようにするには、コードで何をする必要がありますか?

HTML:

<!DOCTYPE html>
<html lang="en">
<head>

<meta charset="utf-8">
<title>Help!</title>

</head>
<body>

<div>
<a href="#" id="1" class="title" name="1">one</a>
</div> 
<div id="workdiv1" class="workdiv" style="display:none">content 1
</div> 
</div> 

<div class="storybottom">
<a href="#" id="2" class="title" name="2">two</a>
</div> 
<div id="workdiv2" class="workdiv" style="display:none">content 2
</div> 
</div> 

<div class="storybottom">
<a href="#" id="3" class="title" name="3">three</a>
</div> 
<div id="workdiv3" class="workdiv" style="display:none">content 3
</div> 
</div> 

<script src="http://code.jquery.com/jquery-1.7.2.min.js"></script>
<script>
    $(document).ready(function() { 
        $('#work').hide(); 

        $('a.title').click(function() { 
            var id = $(this).attr('id'); 
            $('#workdiv' + id).toggle(150); 
            return false; 
        }); 
    }); 
</script>
</body>
</html>
4

2 に答える 2

1 
 $('a.title').click(function(){
      var target = $(this).closest('div').next('div');
      var mode = target.is(':visible');
      target.siblings('div.workdiv').hide();
      if(!mode) target.show(); else target.hide();
 });

このような？

于 2012-05-23T20:27:50.197 に答える
0

http://jsfiddle.net/jbabey/kSQfy/1/

$(document).ready(function() {
    $('a.title').click(function() {
        var correspondingDiv = $(this).parent().next('div');

        if (!correspondingDiv.is(':hidden')) {
            return;
        }

        // hide other divs
        $('.workdiv').hide(150);

        // show this one
        correspondingDiv.toggle(150);
    }); 
}); ​
于 2012-05-23T20:33:18.790 に答える