0

クリックするとdivヘッダーを展開してサブヘッダーを表示するjQueryがあります。このサブヘッダーをもう一度クリックすると、コンテンツが表示されます。ただし、サブヘッダーは2つあり、最初に明らかにすることしかできません。

セレクターをstackoverflow.com/questions/1041344で推奨されている形式に変更しようとしましたが、ページの読み込み時にサブヘッダーが非表示にならないだけでした。これは私がこれまでに得たものです：

jQuery：

<script type="text/javascript">
jQuery(document).ready(function() {
    jQuery(".subheadingFrame, .subheadingEngine").hide();
    jQuery(".heading").click(function()
    {
        jQuery(this).next(".subheadingFrame, .subheadingEngine").slideToggle(500);
    });
    jQuery(".content").hide();
    jQuery(".subheadingFrame, .subheadingEngine").click(function()
    {
        jQuery(this).next(".content").slideToggle(500);
    });
});
</script>

HTML：

<div id="divSparesSubHeader" class="heading">Benelli1</div>
<div id="divSparesLastHeader" class="subheadingFrame">Frame/Subheader1</div>
<div id="divSparesItem" class="content">Content 1</div>
<div id="divSparesLastHeader" class="subheadingEngine">Engine/Subheader2</div>
<div id="divSparesItem" class="content">Content 2</div>

誰かが助けてくれるなら、私はここにページを持っていますか？

4

1 に答える 1

2

これを試して

jQuery(".heading").click(function(){
        jQuery(this).nextAll(".subheadingFrame").first().slideToggle(500);
        jQuery(this).nextAll(".subheadingEngine").first().slideToggle(500);
});

.next().headingの直接の兄弟のみを対象とします。したがって、見つからない場合は、空のリストが返されます。

したがって、このような場合は、とを使用して要素をターゲットにする方が適切です.nextAll() 。.first()

フィドルをチェック

于 2012-10-30T19:46:56.007 に答える