2

答えに影響する場合は、Razorとjquery1.5.1を使用しています。

このサイトの別の投稿からコピーした簡単なjqueryがいくつかあります。Razorエンジンを使用してレンダリングされるセクションの数は可変です。

各セクション(divでラップされている)の下のデータを非表示/表示できるようにしたい

つまり、HTMLは

<div>Course 1<a class="toggle" href="javascript:void(0);">Click</a>
<div class="contentHidden" style="display:none;"> content here </div></div>
<div>Course 2<a class="toggle" href="javascript:void(0);">Click</a>
<div class="contentHidden" style="display:none;"> content here </div></div>

そしてjqueryは;

<script type="text/javascript">
$(document).ready(function(e) {
  $(".toggle").click(function (e) {
    e.preventDefault();
    $(this).children("div").toggle();
  });
});

jqueryはビューの下部にあり、タグが存在document.readyすることを確認するためにビットを追加しました。<a>

私が考えたことの1つは、かみそりを使用してページコンテンツを作成していることですが@foreach()、コンテンツがブラウザにストリーミングされる前にサーバーで行われる必要があるため、リンクが作成される前にこれを行っているとは思いません。ライブまたはデリゲートを使用する必要はありません。

しかし、私は今立ち往生しているので、誰かがこれを追跡する方法を提案できますか(またはもっと良いのはそれを修正する方法です:-)

4

1 に答える 1

4

要素には子aがありませんdiv。代わりに、それは次の要素です:

$(this).next("div").toggle();

視覚的には要素divの下にある可能性があります。aただし、重要なのはDOM構造でありdiv、はの兄弟ですa

于 2012-07-25T19:30:19.293 に答える