仅更改onclicked内容并重置其余内容

时间:2015-05-16 07:46:57

标签: javascript php jquery

音轨列表图片网址:

https://www.dropbox.com/s/2gtd4hrhfhxl4sm/song2.png?dl=0

我有音轨列表。如果我点击第一首歌曲将出现播放按钮以及点击第二首歌曲,播放按钮应该移动到第二首歌曲,首先应该像往常一样。但输出不是预期的结果。任何人都可以指导我。??

我的脚本在这里

function loadSong(song_url, play_img, sequence_id){
    var x = document.createElement("IMG");
    x.setAttribute("src", "images/play.jpg");
    document.getElementById(sequence_id).appendChild(x);
}

1 个答案:

答案 0 :(得分:0)

由于您没有发布HTML结构,我会假设它是这样的:

<div id="container">
    <div class="song">
        <div class="songImgDiv"></div>
        <div class="songTitle">Song 1</div>
    </div>
    <!-- other songs -->
</div>

img.activePlay个分组。

$('.song').on('click', function () {
    var imgSrc = "images/play.jpg";
    $('.song img.activePlay').remove();
    var img = $('<img/>').prop('src', imgSrc).addClass('activePlay');
    $(this).find('.songImgDiv').append(img);
});

jsfiddle DEMO