Jquery 或 Ajax 下拉 div

Question

我从某个网站提取了一个(有效的)jquery 下拉菜单，但我真的不明白为什么它对我的页面不起作用，这是我的代码:

Head

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<script type="text/javascript">
jQuery(document).ready(function() {
  jQuery(".hidden").hide();
  //toggle the componenet with class msg_body
  jQuery(".row").click(function()
  {
    jQuery(this).next(".hidden").slideToggle(500);
  });
});
</script>


Body:
    <div id="likelyToBeWarned">
    <div id="likelyOddHeader" class="row">
        <div id="likelyOddA" class="left">Test</div>
        <div id="LikelyOddB" class="middle"><img class="middle" src="image002.png"/></div>
        <div id="timeZone" class="right">West</div>
        <div id ="rows" class="hidden">
            <div id="weights" class="left">Weights:</div>
            <div id="values" class="middle">ValueA:1234  ValueB:12345 ValueC:123456 ValueD:7654321</div>
            <div id="dbWeights" class="right">dbWeightA: 1234 dbWeightB:12345 dbWeightC:123456 dbWeightD:7654321</div>
        </div>



style/css

.hidden{
 position:relative;
 display: table-row;
 height:45px;
 margin-left:auto;
 margin-right:auto;
}

.left{
    display: table-cell;
}

.right{
display: table-cell;
}

.middle{
display: table-cell;
cursor:pointer;
}
.row{
 display: table-row;
 height:45px;
 margin-left:auto;
 margin-right:auto;
}

编辑:想法是将“隐藏”div 显示为“likelyOddHeader”div 的下拉列表。

感谢您的帮助。

Answer 1

您的 HTML 代码中缺少结束 div

<div id="likelyOddHeader" class="row">
    <div id="likelyOddA" class="left">Test</div>
    <div id="LikelyOddB" class="middle">blablah</div>
    <div id="timeZone" class="right">West</div>
</div> <---------------------------HERE 
<div id ="rows" class="hidden">
        <div id="weights" class="left">Weights:</div>
        <div id="values" class="middle">ValueA:1234  ValueB:12345 ValueC:123456 ValueD:7654321</div>
        <div id="dbWeights" class="right">dbWeightA: 1234 dbWeightB:12345 dbWeightC:123456 dbWeightD:7654321</div>
</div>​

我在 fiddle 中添加了那个 div，它工作正常 http://jsfiddle.net/CZjZs/1/