我想做一个按钮,当点击以后随机切换当前页面的背景音乐,代码如下:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">  
  
<html xmlns="http://www.w3.org/1999/xhtml">  
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>背景音乐切换</title> 
</head>
<body style="height:1800px"><!-- 给BODY加个样式,让页面出现滚动条 -->
<script   language="javascript">   
   function song()   
  {
  var arr=new   Array("01.mp3","02.mp3","03.mp3","04.mp3","05.mp3");   
  var idx=Math.round(Math.random()*10%5);
  document.write("<embed    src='"+arr[idx]+"' loop='0'/><input type='button' value='切换音乐' onclick='song()' />");
  }   
 </script>
 <input type='button' value='切换音乐' onclick='song()' />
</body>  
</html> 
可是点击以后页面总是报错,不知何解,还请大家帮忙!谢谢了!

解决方案 »

  1.   

    document.write会替换整个网页内容,替换后没有了song函数,所以出错,改成这样
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">  
    <html xmlns="http://www.w3.org/1999/xhtml">  
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <title>背景音乐切换</title> 
    </head>
    <body style="height:1800px"><!-- 给BODY加个样式,让页面出现滚动条 -->
    <script   language="javascript">   
    function song() {
    var arr=new  Array("01.mp3","02.mp3","03.mp3","04.mp3","05.mp3");   
    var idx=Math.round(Math.random()*10%5);
    document.getElementById('music').innerHTML = "<embed  src='"+arr[idx]+"' loop='0'/>";
    }
    </script>
    <div id="music"></div>
    <input type='button' value='切换音乐' onclick='song()' />
    </body>  
    </html>