0

我想从我的锚标签中定位最近的 div。所以为了做到这一点，我做了一个小功能，但它不起作用，我还希望一次显示一个 div 具有 id“信息”。

<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />


<style type="text/css">


.frm { float:left; width:700px;}


.information { display:none}

</style>



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


<script type="text/javascript">

$(function (){


    $('.frm').find('a').each(function (){

        $(this).click(function (){

        $(this).closest('div').css ('display','block')


            }
        )

        })

    })


</script>


</head>

<body>

<div class="wrap">
<div class="frm">
<ul>

<li>heading</li>
<li>paragraph</li>
<li><a href="#">link</a></li>

</ul>


<div class="information">

<h6>jitender</h6>
<p>containg data</p>

</div>

</div>

<div class="frm">
<ul>

<li>heading</li>
<li>paragraph</li>
<li><a href="#">link</a></li>

</ul>


<div class="information">

<h6>jitender</h6>
<p>containg data</p>

</div>

</div>


</div>

</body>
4

1 回答 1

1

看到这个工作小提琴：http: //jsfiddle.net/HackedByChinese/twzuq/

$('.frm a').click(function(e) {
   e.preventDefault();

   $('.information').hide(); // make sure all .information divs are hidden
   $(this).closest('ul').next('.information').show(); // show the .information div nearest the link
});​

正如评论中提到的，.closest遍历当前元素的祖先以找到与选择器匹配的元素。所以，在这里我找到了包含点击链接的 UL，然后我用它.next来选择下一个具有.information该类的元素。

此外，.show分别.hide设置display=none和block（或者inline，如果元素是内联的）。使用的快捷方式.css('display','none')。

于 2012-06-12T01:37:49.507 回答