user1925266
user1925266

Reputation: 1

This JavaScript code is not working in an HTML5 application

I am trying to make a simple application in HTML5 with JavaScript. It's supposed to play a random sound, when you push the button.

It works fine, when uploaded to a website, but it doesen't work on my smartphone.

<!doctype html>
<html>
    <head>
        <script type="text/javascript" src="jquery.min.js"></script>
        <script>
            function playSounds() {
                var sounds = new Array(
                    "musik/shut the f**k up.mp3",
                    "musik/My gun's bigger than yours!.mp3"
                );
                var index = Math.floor(Math.random() * (sounds.length));
                $("#element").html("<embed src=\"" + sounds[index] + "\" hidden=\"true\" autostart=\"false\" />");
            }
        </script>
        <title></title>
        <meta charset="utf-8">
    </head>
    <body= "javascript:playSounds()">
        <button onClick="playSounds()">
            LAUGH</button>
        <div id="element">
        </div>
    </body>
</html>

I copied the content in file jquery.min.js from a site and linked it directly in the application to the mainpage, where the sound needs to play.

The source is here:

http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js

I tried debugging the JavaScript code, but I can't seem to find the issue.

How do I solve this?

Upvotes: 0

Views: 183

Answers (1)

Niet the Dark Absol
Niet the Dark Absol

Reputation: 324640

Mobile devices in general do not support <embed>.

Your use of <embed> shows you have an imperfect understanding of what an "HTML5 app" is. Such an app would use <audio> and check canPlayType("audio/mpeg") to see if the browser supports MP3 playback.

Upvotes: 3

Related Questions