1

私のウェブサイトで PHP を使用してループされているいくつかの div を切り替えています。問題は div id を渡すことですが、10 個の記事をループしている場合、これにより 10 個のスクリプトが作成されます。id を渡して関連する div を開くより良い方法はありますか?

http://jsfiddle.net/NbGSB/

<script>
$('#toggle4').click(function() {
$('.toggle4').slideToggle('fast');
    return false;
});
</script>
<a href="#" id="toggle4">Slide Toggle</a><br /><br />
<div class="toggle4" style="display:none; background-color:#4CF;width:100px;height:200px;"></div>

複数の div がある場合はどうなるでしょうか。常にIDを渡してスクリプトもループする必要がありますか、それとももっと良い方法がありますか? 申し訳ありませんが、jQueryが苦手です

4

2 に答える 2

1

はい、記事に「arcticle-toggle」のように1つのクラスを与えてから、2つのbrタグの後にdivをスライドさせます。HTML:

<a href="#" class="article-toggle">Slide Toggle 1</a><br /><br />
<div style="display:none; background-color:#4CF;width:100px;height:200px;"></div>

<a href="#" class="article-toggle">Slide Toggle 2</a><br /><br />
<div style="display:none; background-color:#8CF;width:100px;height:200px;"></div>

JS:

<script>
 $('.article-toggle').click(function() {
  $(this).next().next().next().slideToggle('fast');
 return false;
}
</script>

フィドル

于 2012-11-23T07:41:13.117 に答える
1

それを行うには多くの方法があります。

HTMLを変更せずに、すべてのトグルとdivの後にこれを配置することでそれを行うことができます-タグの直前</body>が通常良い場所です

<script type="text/javascript">
$('[id^="toggle"]').click(function() {
    $(this).next('[class^="toggle"]').slideToggle('fast');
    return false;
});
</script>

$('[id^="toggle"]')$('[class^="toggle"]')ID とクラスがそれぞれ「toggle」で始まるすべての要素を選択します。

于 2012-11-23T07:53:14.383 に答える