0

アンカー タグから最も近い div をターゲットにしたい。そうするために、私は1つの小さな関数を作成しましたが、それは機能していません。また、ID「情報」を持つ一度に1つのdivショーが必要です。

<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設定します。を使用するためのショートカット。displaynoneblockinline.css('display','none')

于 2012-06-12T01:37:49.507 に答える