1

我对 Javascript 很陌生。我一直试图弄清楚这一点，但似乎无法解决。所以我的问题是...

我需要在代码中做什么，以便当您打开“一”并单击“二”时，“一”下面的内容会折叠？

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 回答