我试图获取存储在本地驱动器上的视频，以便在我制作的网页上播放。我试过在三个浏览器中打开页面，但它从不显示（更喜欢 chrome）。我已经直接在 chrome 中运行了视频（mp4），它们都可以正常工作。所以这不是支持问题。下面我附上了我的 HTML 和 JS。有与此相关的 CSS，但我不明白为什么会导致任何播放问题。我已经在这几个小时了，现在很卡住。另外，我使用 Aptana 进行开发并从那里运行它。
如果有人想看看，这里是完整的代码：http: //jsfiddle.net/pGzTR/
这是我用过的html：
<section id="main_section">
<video id="myMovie" width="320" height="180">
<source scr="a1/db.mp4"/>
</video>
<nav id="video_nav">
<div id="buttons">
<button type="button" id="playButton">Play</button>
</div>
<div id="defaultBar">
<div id="progressBar"></div>
</div>
<div style="clear: both"></div>
</nav>
</section>
scr="a1/db.mp4" 这是引用 html 和视频文件所在的文件夹。
这是用于功能的 javascript
function doFirst(){
barSize = 600;
myMovie = document.getElementById('myMovie');
playButton = document.getElementById('playButton');
bar = document.getElementById('defaultBar');
progressBar = document.getElementById('progressBar');
playButton.addEventListener('click', playOrPause, false);
bar.addEventListener('click', clickBar, false);
}
function playOrPause(){
if(!myMovie.paused && !myMovie.ended){
myMovie.pause();
playButton.innerHTML='Play';
window.clearInterval(updateBar);
}else{
myMovie.play();
playButton.innerHTML='Pause';
updateBar=setInterval(update, 700)
}
}
function update(){
if(!myMovie.ended){
size = parseInt((myMovie.currentTime*barSize)/myMovie.duration);
progressBar.style.width = size +'px';
}else{
progressBar.style.width='0px';
playButton.innerHTML='Play';
window.clearInterval(updateBar);
}
}
function clickBar(e){
if(!myMovie.paused && !myMovie.ended){
mouseX=e.pageX-bar.offsetLeft;
newTime=mouseX*myMovie.duration/barSize;
myMovie.currentTime=newTime;
progressBar.style.width=mouseX+'px';
}
}
window.addEventListener('load',doFirst,false);