मैं सोच रहा हूं कि जब गाना क्लिक किया जाए तो गाना कैसे बजाया जाए। वर्तमान में जब मैं किसी गाने पर क्लिक करता हूं तो मुझे प्ले बटन पर क्लिक करना होता है, हालांकि मैं चाहता हूं कि जब मैं उस पर क्लिक करूं तो वह ऑटो प्ले हो जाए। इससे पहले कि मैं यह काम करता था, हालांकि मुद्दा यह था कि तब प्ले बटन गड़बड़ हो गया था। यह fiddle का लिंक है। यह मेरा जावा स्क्रिप्ट कोड है।

$(function() {
    const audio = $('audio')[0];

    $('#player a').click(function(e) {
        e.preventDefault();

        $(this).find('i').toggleClass('fa-play-circle fa-pause-circle');

        if (audio.paused) {
            audio.play();
        } else {
            audio.pause();
        }
    });

    audio.ontimeupdate = () => {
        $('#progress').css('width', audio.currentTime / audio.duration * 100 + '%');
        $('#timer').text(formatTime(audio.currentTime));
    };

    audio.onended = () => {

    };

    $('#progress-bar').click(function(e) {
        e.preventDefault();
        audio.currentTime = e.offsetX / $(this).width() * audio.duration;
    });

    function formatTime(seconds) {
        let minutes = Math.floor(seconds / 60);
        seconds = Math.floor(seconds % 60);
        seconds = (seconds >= 10) ? seconds : '0' + seconds;
        return minutes + ':' + seconds;
    }
});
audioPlayer();
function audioPlayer(){
var currentSong = 0;
$("#audioPlayer")[0].src = $("#playlist li a")[0];
$("#playlist li a").click(function(e){
e.preventDefault();
$("#audioPlayer")[0].src = this;
$("#playlist li").removeClass("current-song");
currentSong = $(this).parent().index();
$(this).parent().addClass("current-song");
});
$("#audioPlayer")[0].addEventListener("ended", function(){
currentSong++;
if(currentSong == $("#playlist li a").length)
currentSong = 0;
$("#playlist li").removeClass("current-song");
$("#playlist li:eq("+currentSong+")").addClass("current-song");
$("#audioPlayer")[0].src = $("#playlist li a")[currentSong].href;
$("#audioPlayer")[0].play();
});
}
0
coder123 5 जिंदा 2020, 05:11

1 उत्तर

सबसे बढ़िया उत्तर

इसे अपने JSFiddle की लाइन 3 पर रखें और यह काम करता है:

$('#playlist li a').click( () => {
  audio.play();
  $('#player a i').removeClass('fa-play-circle');
  $('#player a i').addClass('fa-pause-circle');
} );

0
Nathan Hawks 5 जिंदा 2020, 02:54