Jqueryeach() 无法正常工作

Question

我有一些代码需要调整。我需要将 .play“rel”替换为 .audio_player“id”。将需要遍历多个“媒体”div。

这是代码

<div class="media">
    <div class="message_buttons">
        <li id="listen" class="play_button">
            <a class="play" rel="" href="AudioFile.mp3"> Listen </a>
        </li>
    </div>
    <div class="audio_player" id="play1243">
        <audio controls="controls"></audio>
    </div>
</div>

这是我到目前为止的脚本。它似乎适用于第一个媒体div，但随后使页面上的每个.play“rel”与第一个audio_player“id”相同，而不是其自己的div中的“id”。

$.each($('.play'), function( index ) {
    //$(this).attr("rel", $(".audio_player").attr("id"));
    $(".play").attr("rel", $(".audio_player").attr("id"));
});

我注释掉了另一个也可以工作但给出相同结果的版本。非常感谢你们帮助我走到这一步。我觉得我现在真的非常接近。但最后那一点点却无法得到。感谢您的时间。

Answer 1

只需在选择器上运行 each()，然后您就可以对找到的每个元素使用 this 上下文:

$('.play').each(function(i) {
    var id = $(this).parents('.media').find('.audio_player').attr('id');
    $(this).attr('rel', id);
});