1

我正在尝试创建一个 ASP.NET 页面并在其上使用一些 HTML5。其中大部分来自 w3schools 的示例。

编辑 我使用 chrome 作为我的主要测试浏览器。mp4 和 ogg 在 Firefox 中都不起作用,整个视频标签在 ie8 中不起作用。因为我用的是xp,ie9是不可能的。如果需要,我可以安装歌剧或野生动物园……如果有帮助,请告诉我。

编码:

<div> 
<video id="movieid" width="420">
<source src="movie.mp4" type="video/mp4" />
<source src="oggbestand.ogg" type="video/ogg" />
<p>Als uw browser te oud is, word deze melding weergegeven. Excuses voor het ongemak!</p>
</video>
<button onclick="playPause()">Play/Pause</button> 
<button onclick="makeSmall()">Small</button>
<button onclick="makeNormal()">Normal</button>
<button onclick="makeBig()">Big</button>
<br /> 
</div>  

<script>
function playPause() {
var myVideo = document.getElementById("movieid");
if (myVideo.paused)
myVideo.play();
else
myVideo.pause();
}
function makeBig() {
var myVideo = document.getElementById("movieid");
myVideo.width = 560;
}
function makeSmall() {
var myVideo = document.getElementById("movieid");
myVideo.width = 320;
}
function makeNormal() {
var myVideo = document.getElementById("movieid");
myVideo.width = 420;
} 
</script>

问题: 上面的四个按钮似乎工作。但是,不知何故,页面刷新或其他什么,将视频恢复到原始大小。谁能帮我解决这个问题,甚至解决它?

谢谢你的帮助!

4

1 回答 1

0

每当您单击一个按钮时,您都会触发一个回发,所以这里发生的是您正在运行一些 JavaScript 代码来编辑您的 HTML,然后触发一个完整的回发,这将为您提供一个全新的 HTML 页面。

简单修复:添加“return false;”

<button onclick="playPause(); return false;">Play/Pause</button> 
<button onclick="makeBig(); return false;">Big</button>
<button onclick="makeSmall(); return false;">Small</button>
<button onclick="makeNormal(); return false;">Normal</button>
于 2013-08-28T09:12:28.427 回答