0

以下のコードからわかるように、「メモ」をクリックすると「revealFootNote」をポップアップしようとしています。それは問題なく動作しますが、10 フィートのメモがあり、それらのいずれかをクリックするとすべてポップアップします。各脚注には、「1」、「2」、「10」の一意の ID があります。特定のクラスがクリックされたときに、関連する脚注のみがポップアップする必要があります。.note を #one に置き換えても機能しますが、クリックしたクラスに対して #one がポップアップします。

$(document).ready(function(){                                               
    $(".note").click(function() {;
        $(".footNote").toggleClass("revealFootNote");
    });
    $(".footNote").click(function() {;
        $(this).toggleClass("revealFootNote");
    });
});

ヘルプ！私はjQueryを学習して2日です。

ありがとう、タリエシン

それで、皆さんが私にくれたすべての助けの後の最終結果：

$(".note, .revealFootNote").click(function() {
    if ($(this).hasClass('note')) {
        $('#'+$(this).data('target')).toggleClass("revealFootNote");
    } else {
        $(this).hide();
    }
});
    $(".footNote").click(function() {;
        $(this).toggleClass("revealFootNote");
});
4

2 に答える 2

0

あなたのhtmlを見た後に私が作ったこれを試すことができます：http://jsfiddle.net/7Q23b/

$('ul li').click(function () {
   if ($('.note',this).text() == '9') {
      $('#nine').toggle();
   } else if ($('.note',this).text() == '10') {
      $('#ten').toggle();
   }
});
于 2013-02-03T14:54:49.063 に答える
0

HTML

<ul>
    <li>Running speed<span class="note" data-target="nine">9</span></li>
    <li>Ki<span class="note" data-target="ten">10</span></li>
    <li>ESP<span class="note" data-target="eleven">11</span></li> 
</ul> 

<aside class="footNote" id="nine"> The average human can run 7.5 miles per hour. </aside> 
<aside class="footNote" id="ten"> Ki and ESP points can be further modified with the use of skills or alchemical substances. </aside>
<aside class="footNote" id="eleven"> Footnote Eleven </aside>

jQuery

$(document).ready(function($) {
    $(".note, .footNote").click(function() {
        if ($(this).hasClass('note')) {
            $('#'+$(this).data('target')).show();
        } else {
            $(this).hide();
        }
    });
});
于 2013-02-03T14:39:15.460 に答える