0

音楽ページを設定しました。曲の再生ボタンをクリックすると、クラスが からbuttons_mp3jに変わりbuttons_mp3jpauseます。クラスが の場合、その親を対象にしてクラスを追加しbuttons_mp3jpauseたいと考えています。li.song

<li class="song">
    <div>
        <span>
            <span class="buttons_mp3jpause">
            </span>
        </span>
    </div>
</li>

次のコードを試しましたが、うまくいきませんでした。

$(".buttons_mp3jpause").parents("li.song").addClass("playing");

どこで私は間違えましたか？

編集

$('.haiku-play').bind('click', function() {
    $('.haiku-player').jPlayer("pause");
})

編集 2

<article>
    <ul>
        <li class="song">yadayada</li>
        <li class="song">yadayada</li>
        <li class="song">yadayada</li>
        <li class="song">yadayada</li>
    </ul>
</article>
<article>
    <ul>
        <li class="song">yadayada</li>
        <li class="song">yadayada</li>
        <li class="song">yadayada</li>
        <li class="song">yadayada</li>
    </ul>
</article>
<article>
    <ul>
        <li class="song">yadayada</li>
        <li class="song">yadayada</li>
        <li class="song">yadayada</li>
        <li class="song">yadayada</li>
    </ul>
</article>
4

2 に答える 2

2

質問で述べたように、クラスを動的に割り当てているbuttons_mp3jpauseため、ページの読み込み時に DOM に存在する要素にハンドラーをアタッチし、jQuery を使用して動的クラスに委任する必要があります.on()。

$('.song').on('click', '.buttons_mp3jpause', function() {
    $(this).closest('li.song').addClass('playing');
});

最初のコメントへの応答:

playing他のすべての要素からクラスを削除するだけです (以下では、すべての要素が!)songであると想定しています。songsiblings

.addClass('playing').siblings('li.song').removeClass('playing');

最後のコメントへの返信:

この状況で最も簡単なのはplaying、すべての要素からクラスを削除しsongてから、関連する要素に追加することです。

$('li.song').removeClass('playing');
$(this).closest('li.song').addClass('playing');

完全な例:

$('.song').on('click', '.buttons_mp3jpause', function() {
    $('li.song').removeClass('playing');
    $(this).closest('li.song').addClass('playing');
});
于 2013-04-05T11:28:29.157 に答える