1

私のサイトは Spotify ライブラリを検索し、結果のリストを返します。アイデアは、ユーザーが結果の 1 つをクリックして、それをプレイリストに追加し、フォーム送信の一部として投稿できるようにすることです。以下のコードは、クリックされた曲を .selected-list コンテナーに追加し、Spotify の曲の href の値を使用して非表示の入力を DOM に追加します。

これはすべて機能しますが、新しい曲をクリックして新しい入力が追加されるたびに、以前に追加されたすべての入力の href も変更されます。すべての入力が持っている .track を特定しているためであることはわかっていますが、どうすればよいかわかりません。 

$('.spotify-result').click(function() {
        $(this).clone().appendTo($('.selected-list'));
        $('.submit-spotify').before('<input type="hidden" id="track_href" class="track" value="" name="track_href" />');
        $('.track').val($('.track-href', this).text());
});
4

3 に答える 3

1

.trackこれは、コードの最終行でクラスをセレクターとして使用しているためです( $('.track').val($('.track-href', this).text());)。class="track"これにより、前のコード行に示されているように、すべての新しい入力が持つ を持つすべての要素が更新されます。

HTML 出力のサンプルをご覧いただければ、解決策をお手伝いするのが少し簡単になるかもしれません。. . あなたが選択しているもののいくつかを伝えるのは難しい. . .

ただし、現時点での私の最善の推測は、最後の 2 行を 1 つに結合して、入力を作成するときに値を設定することです。

    $('.submit-spotify').before('<input type="hidden" id="track_href" class="track" value="' + $('.track-href', this).text() + '" name="track_href" />');
于 2013-03-29T15:36:38.590 に答える
1

次のコードを置き換えます。

$('.track').val($('.track-href', this).text());

これについて：

$('.submit-spotify').prev('.track').val($('.track-href', this).text());
于 2013-03-29T15:34:07.113 に答える
1

したがって、アイテムがリストに追加されるたびに新しい非表示の入力を作成することを考えている場合は、次のことをお勧めします。

$('.spotify-result').click(function() {
        var $input = $('<input type="hidden" id="track_href" class="track" value="" name="track_href" />');

        $(this).clone().appendTo($('.selected-list'));
        $('.submit-spotify').before($input);
        $input.val($('.track-href', this).text());
});

これにより、ページ上の要素であるかのように操作できる jQuery オブジェクトが作成$inputされ、準備ができたらページのどこかに挿入できます。この方法では、DOM に表示される順序は問題にならないため、ページ上の場所を変更する必要がある場合でも、.prev()メソッドと格闘する必要はありません。

于 2013-03-29T15:51:01.863 に答える