CODEWITHSUNDEEP
google-chromefirefoxdomaudiohtml5-audio
porton
porton

Reputation: 5803

Audio does not play (browser bug for both Chrome and Firefox?)

Audio does not play on both Chrome and Firefox. Why?!

https://jsfiddle.net/8udfegbq/

<html>
    <head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <script src="https://code.jquery.com/jquery-3.5.1.min.js"></script>
    </head>
    <body>
        <audio id="my-audio" class="video-js" controls="controls" preload="auto" data-setup="{}">
            <source/>
            <p>
            To hear this audio please enable JavaScript, and consider upgrading to a
            web browser that
            <a href="https://videojs.com/html5-video-support/" target="_blank">supports HTML5 audio</a>
            </p>
        </audio>
        <script>
            function displayVideo(id, link) {
                link = "https://arweave.net/eAESnl8QnIw9gG4Wj1RvK3dlLepMlIsDEGiYNqTp_zw";
                $.ajax(link, {method: 'HEAD'})
                    .then(function(data, textStatus, xhr) {
                        console.log("Loaded.")
                        const type = "audio/wav";
                        const source = $(`#${id}audio source`);
                        source.attr('src', link);
                        source.attr('type', type);
                    })
            }
            displayVideo('my-', "https://arweave.net/eAESnl8QnIw9gG4Wj1RvK3dlLepMlIsDEGiYNqTp_zw");
        </script>
    </body>
</html>

Upvotes: 0

Views: 93

Answers (1)

jrossi
jrossi

Reputation: 196

After setting the attribute on the source element, tell the audio element to load the source. This should do the trick:

$("#my-audio")[0].load();

Upvotes: 1

Related Questions