1

我的网站搜索 Spotify 库并返回结果列表。这个想法是用户可以单击其中一个结果并将其添加到播放列表中，该播放列表又将作为表单提交的一部分发布。下面的代码将点击的歌曲添加到 .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').val($('.track-href', this).text());

对于这个：

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

这是因为您在代码的最后一行 ( )中使用了.track类作为选择器。$('.track').val($('.track-href', this).text());这将更新所有具有 的元素class="track"，如前面的代码行所示，每个新输入都将具有。

如果我们可以看到您的 HTML 输出示例，那么为您提供解决方案可能会更容易一些。. . 很难说你选择了什么东西。. .

不过，我现在最好的猜测是尝试将最后两行合二为一，并在创建输入时设置值：

    $('.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

因此，如果想法是在每次将项目添加到列表时创建一个新的隐藏输入，我建议执行以下操作。

$('.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());
});

This creates a jQuery object called $input that you can manipulate as if it were an element on the page and when you're ready inject it somewhere on your page. This way it doesn't matter what order it appears in the DOM so if you have to change where it goes on your page you won't have to wrestle with .prev() methods.

于 2013-03-29T15:51:01.863 回答