问jquery中的.closest
EN

Stack Overflow用户

提问于 2012-06-12 09:32:02

回答 1查看 649关注 0票数 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>

jquery

html

回答 1

Stack Overflow用户

回答已采纳

发布于 2012-06-12 09:37:50

看看这个有用的小提琴：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')的快捷方式。

票数 1

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/10989546

复制

相似问题

问jquery中的.closest
EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问jquery中的.closestEN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问jquery中的.closest
EN