0

A while ago, I created (with much help) a program that uses php and javascript to make some ambient music by randomizing an array of .ogg files. Now I am trying to re-write it with js alone.

The new code immediately below does not work (the .ogg files do play properly when clicked individually, but nothing happens when you press the 'start' button, which is the main feature). (The code below that (containing php) does work.) I've been over the new code several times and I think I've got the 'typos'. I'm pretty sure the problem is in the syntax of the window.setTimeout line, but haven't quite figured out how it should be.

Thanks for any help you can offer!

<!DOCTYPE html>
<html>
<head>

<title>Audio Testing</title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>

<script>
    function getRandInt (min, max) 
        {
        return Math.floor(Math.random() * (max - min + 1)) + min;
        }

    function shuffle(o) 
        {
        for(var j, x, i = o.length; i; j = parseInt(Math.random() * i), x = o[--i], o[i] = o[j], o[j] = x);
        return o;
        }

</script>

<script type="text/javascript">

    var tonesTotal = 150;  

    function getDelays(tonesTotal)   
        {
            var return_array = array();
            for (var i = 0; i < tonesTotal; i++)
                {
                    var r = getRandInt(0, 600);    
                    var delay = r * 1000;
                    return_array.push(delay);  
                }
            return return_array;  
        }

    var delays = new Array();
    delays = getDelays(tonesTotal);

    $(document).ready(function() 
        {
            $("#start").click(function()     
                {   
                var base = 'sound';
                for(var i = 0; i < tonesTotal; i++)
                    var id = base + ((i + 1) ); 
                    window.setTimeout ("document.getElementById('" + id + "').play()", delays[i]);

                });
        }); 

</script>
</head> 

<body style="background-color: #999;">

    <button id="start">Start</button>
    <br><br>

<script> 
    var tonesTotal = 150; 
    var samples = new Array("tone0.ogg", "tone2.ogg", "tone4.ogg", "tone6.ogg", "tone7.ogg", "tone9.ogg", "tone11.ogg", "tone12.ogg");  
    for (var i=1; i <= tonesTotal; i++) 
    {
        shuffle (samples);
        var samplepick = samples[0];
        document.write ("<audio controls id='sound" + i + "'><source src='" + samplepick + "' type='audio/ogg'></audio>");
    }               
</script>
</body>
</html>

PREVIOUS CODE:

<!DOCTYPE html>
<html>
<head>
    <title>Audio Testing</title>
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
    <?php 
    //$randC = rand(1,4); 
    $C = 150;

    function getDelays($C)
    {
        $return_array = array();
        for($i = 0; $i < $C; $i++)
        {
            $r = rand(0, 600);
            $delay = $r * 1000;
            array_push($return_array, $delay);
        }
        return $return_array;
    }
    echo "<script type=\"text/javascript\">\n";
    echo "var delays = new Array();";
    $delays = getDelays($C);
    for($i = 0; $i < sizeof($delays); $i++)
    {
        echo "delays[" . $i . "] = " . $delays[$i] . ";\n";
    }
    echo "
            $(document).ready(function() 
            {
              $(\"#start\").click(function() 
              { 
                var base = 'sound';
                for(i = 0; i < $C; i++)
                {           
                    var id = base + ((i + 1) ); 
                    window.setTimeout (\"document.getElementById('\" + id + \"').play()\", delays[i]);
                }
              });             
            });
        </script>
        ";
        ?>

        <style type="text/css">
        </style>
</head> 

<body style="background-color: #999;">

    <button id="start">Start</button>
    <br><br>

    <?php
    $samples = array("tone0.ogg", "tone2.ogg", "tone4.ogg", "tone6.ogg", "tone7.ogg", "tone9.ogg", "tone11.ogg", "tone12.ogg"); 
    for ($i=1; $i<= $C; $i++) {
        shuffle ($samples);
        $samplepick = $samples[0];
        echo '<audio controls id="sound'.$i.'">
        <source src='.$samplepick.' type="audio/ogg">
        </audio>';
    }

    ?>

</body>
</html>
4

1 に答える 1

0

ローカルでテストしたところ、getDelays() 関数で Javascript エラーが見つかりました。コードの最初の行は次のようになります。

var return_array = new Array();
于 2013-08-31T20:41:00.027 に答える