在写一个大学生实训用的网站时,遇到一个问题。
具体经过是这样的,我想要实现网页显示在不同的div时,播放不同的背景音乐。但是每次都发现只会播放第一个div的音乐。
主要代码如下:
var sound1="music/page1.mp3";
var sound2="music/page2.mp3";
var sound3="music/page3.mp3";
var sound4="music/page4.mp3";
var sound5="music/page5.mp3";
var sound6="music/page6.mp3";
var sound7="music/page7.mp3";
var soundx="music/text.mp3";//各个div音乐的路径写出来
var x;
if(index==1){
x=sound1; //在第一页时播放sound1
}else if(index==2){
x=sound2; //在第二页时播放sound2
}else if(index==3){
x=sound3;
}else if(index==4){
x=sound4;
}else if(index==5){
x=sound5;
}else if(index==6){
x=sound6;
}else if(index==7){
x=sound7;
}else{
x=soundx; //测试什么时候出错的时候,播放text音乐
}
//写embed标签,播放背景音乐
document.write('<embed src='+'"'+x+'"'+'hidden="true" autostart="true" loop="true">');
大概解释一下,index代表当前屏幕所在的“页”,总共有7页,也就是div1-div7,我实现了鼠标往下滑,整个网页就刚好往下滑一个屏幕大小的区域,然后屏幕上显示的div1变到div2,index+1,再往下滑,屏幕上显示的div2变到div3......,index+1,这些功能我都测试过是没有问题的。
那么现在问题来了,为什么我的网页还是可以从div1滑到其他div,但是背景音乐始终放的是sound1,我试过给index初始值为2,然后背景音乐就变成sound2,设为3变成sound3......既然如此我觉得问题还是在document.write上,是不是document.write在整个html文档里只可以执行一次呢?或者我哪里做的不对,恳请各位大哥帮忙看一下,以解大学生当下之急。