0

jqueryトグルを使用してコンテンツ付きのdivを表示しています。私が抱えている問題を説明する方法はわかりませんが、私のテストページに移動して、類似映画の最初のリンクをクリックすると（映画500日のサマーと一致します）、類似映画で開いたパネルが表示されます。次の「似たような映画」リンク（「恋のからさわぎ」と一致）に移動すると、最初の映画のセットを引き続き制御していることがわかります。つまり、パネルを上下に切り替えます。実際、すべての類似映画リンクが最初のパネルを制御します。これを修正する方法がわかりません。*削除されたリンク-もう必要ありません-ありがとう！

<script type="text/javascript"> 
$(document).ready(function(){
$(".flip").click(function(){
    $("#panel").slideToggle("slow");
  });
});
</script> 

<div class="flip">Similar Movies
</div><!-- end of flip-->

    <div id="panel">
similar movies are echoed here from a database using php...
</div>
4

4 に答える 4

2

パネルにIDを使用する代わりに、次のようなクラスを使用します。

<div class="panel">
  similar movies are echoed here from a database using php...
</div>

次に、jQueryで：

$(document).ready(function() {
  $(".flip").click(function() {
    $(this).siblings(".panel").slideToggle("slow");
  });
});

複数の要素で同じIDを使用することはお勧めしません。特に、 jQueryを使用するときに問題が発生します。

于 2013-03-14T22:13:02.923 に答える
0

これは、同じ「id」を持つdivが多数あるためです。次のコードを使用して修正できます。

$(document).ready(function(){
$(".flip").click(function(){
    $(this).next().slideToggle("slow");
  });
});
于 2013-03-14T22:13:56.493 に答える
0

これは、クリック関数がdivを最初のIDであるpanelのIDとのみ切り替えるためです。このIDを持つ他のdivがある場合、idは一意である必要があり、jQueryは指定された値を持つ最初のIDを見つけて処理するため、それらは無視されます。jQuery関数をからid="panel"にclass="panel"変更して変更し、クラスを持つ次の兄弟要素を探してpanel切り替える必要があります。

コードは次のようになります。

$(document).ready(function(){
    $('.flip').click(function(){
        $(this).next('.panel').slideToggle('slow');
    });
});
于 2013-03-14T22:14:53.727 に答える
0

次のようなものを試してください。

<div class="container">
<div class="flip">Similar Movies
</div><!-- end of flip-->

    <div class="panel">
similar movies are echoed here from a database using php...
</div>
</div>

var panel;
$(".flip").click(function(){
    panel = $(this).parent('.container').children('.panel');
    panel.slideToggle("slow");
 })
于 2013-03-14T22:38:33.700 に答える