-1

クリックしてオーディオファイルを再生できるIDなしで複数のspan.playが必要です。

問題：現在のファイルにのみ期間を表示する$（this）

$('.play').each(function() {

    $(this).append('<span class="playIcon"><img src="http://upload.wikimedia.org/wikipedia/commons/thumb/7/76/Fairytale_player_play.png/14px-Fairytale_player_play.png"></span><span class="playDur"></span>');


    $(this).click(function() {
        var file = this.firstChild;
        if (file.paused != false) {
            //+ stop all others before playing new one
            file.play();
        } else {
            file.pause();
        }
        file.addEventListener("timeupdate", function() {
            var len = file.duration,
                ct = file.currentTime,
                s = parseInt(ct % 60),
                m = parseInt((ct / 60) % 60);
            if (s < 10) {
                s = '0' + s;
            }
            $(".playDur").html('&nbsp;(' + m + ':' + s + ')');
            if (ct == len) {
                $(".playDur").html('');
            }
        }, false);
    });

});

テスト：

http://jsfiddle.net/sQPPP/

http://jsfiddle.net/sQPPP/1/-使用$(this).children( ".foo" )

4

1 に答える 1

0

コールバック内の変更.playとして、jQueryオブジェクトを変数に保存する必要があります。thisaddEventListener

http://jsfiddle.net/sQPPP/2/

$('.play').each(function(index) {
    var $play = $(this);
    $play.append('<span class="playIcon"><img src="http://upload.wikimedia.org/wikipedia/commons/thumb/7/76/Fairytale_player_play.png/14px-Fairytale_player_play.png"></span><span class="playDur"></span>');


    $play.click(function() {
        var file = this.firstChild;
        if (file.paused != false) {
            //+ stop all others before playing new one
            file.play();
        } else {
            file.pause();
        }
        file.addEventListener("timeupdate", function() {
            var len = file.duration,
                ct = file.currentTime,
                s = parseInt(ct % 60),
                m = parseInt((ct / 60) % 60);
            if (s < 10) {
                s = '0' + s;
            }
            $play.children( ".playDur" ).html('&nbsp;(' + m + ':' + s + ')');
            if (ct == len) {
                 $play.children( ".playDur" ).html('');
            }
        }, false);
    });

});​
于 2012-12-15T20:19:13.677 に答える