Javascript 为什么我的视频不能用html5播放？_Javascript_Html_Video_Mp4_Ogg

Javascript 为什么我的视频不能用html5播放？

javascript html video

Javascript 为什么我的视频不能用html5播放？,javascript,html,video,mp4,ogg,Javascript,Html,Video,Mp4,Ogg,我正在尝试用html5播放视频。它在任何浏览器中都不起作用我为播放/暂停等创建按钮。我使用功能来启用按钮功能我使用了一个视频，但我的视频不起作用我只看到一个黑屏当我点击按钮时，我会看到下面的错误 TypeError:myVideo为空我的代码如下。为什么我的视频不起作用 <!DOCTYPE html> <html> <body> <div style="text-align:center"> <button oncl

我正在尝试用html5播放视频。它在任何浏览器中都不起作用

我为播放/暂停等创建按钮。我使用功能来启用按钮功能

我使用了一个视频，但我的视频不起作用

我只看到一个黑屏

当我点击按钮时，我会看到下面的错误

TypeError:myVideo为空

我的代码如下。为什么我的视频不起作用

<!DOCTYPE html> 
<html> 
<body> 

<div style="text-align:center"> 
  <button onclick="playPause()">Play/Pause</button> 
  <button onclick="makeBig()">Big</button>
  <button onclick="makeSmall()">Small</button>
  <button onclick="makeNormal()">Normal</button>
  <br> 
  <video id="video1" width="420">
    <source src="mov_bbb.mp4" type="video/mp4">
    <source src="mov_bbb.ogg" type="video/ogg">
    Your browser does not support HTML5 video.
  </video>
</div> 

<script> 
var myVideo=document.getElementById("video1"); 

function playPause()
{ 
if (myVideo.paused) 
  myVideo.play(); 
else 
  myVideo.pause(); 
} 

function makeBig()
{ 
myVideo.width=560; 
} 

function makeSmall()
{ 
myVideo.width=320; 
} 

function makeNormal()
{ 
myVideo.width=420; 
} 
</script> 
</body>
</html>


播放/暂停
大的
小的
正常的


您的浏览器不支持HTML5视频。
var myVideo=document.getElementById（“video1”）；
函数playPause（）
{ 
如果（myVideo.paused）
myVideo.play（）；
其他的
myVideo.pause（）；
} 
函数makeBig（）
{ 
myVideo.width=560；
} 
函数makeSmall（）
{ 
myVideo.width=320；
} 
函数makeNormal（）
{ 
myVideo.width=420；
}

您确定源路径正确吗

另一个要检查的是您的.htaccess

将以下内容添加到服务器上的.htaccess文件中：

AddType video/ogg .ogv .ogg
AddType video/webm .webm
AddType video/mp4 .mp4

你的代码很好-如果我从videojs插入示例URL，它就可以正常工作

我建议你试着阅读这篇文章，开始学习HTML5视频，而不是W3

您的视频文件可能存在文件格式问题，或者服务器配置问题（可能是mime类型的问题，但所有内容都将在上面的链接中解释）

如果您想知道更多关于错误代码的确切原因，您可以在本文末尾尝试代码

HTML5视频在一开始可能很棘手，但你会发现：）

JSIDLE代码：

<div style="text-align:center"> 
  <button onclick="playPause()">Play/Pause</button> 
  <button onclick="makeBig()">Big</button>
  <button onclick="makeSmall()">Small</button>
  <button onclick="makeNormal()">Normal</button>
  <br /> 
  <video id="video1" width="420">
    <source src="http://vjs.zencdn.net/v/oceans.mp4" type="video/mp4"></source>
    <source src="http://vjs.zencdn.net/v/oceans.webm" type="video/webm"></source>
    Your browser does not support HTML5 video.
  </video>
</div> 

<script type="text/javascript"> 
var myVideo=document.getElementById("video1"); 

function playPause()
{ 
if (myVideo.paused) 
myVideo.play(); 
else 
 myVideo.pause(); 
} 

function makeBig()
{ 
myVideo.width=560; 
} 

function makeSmall()
{ 
myVideo.width=320; 
} 

function makeNormal()
{ 
myVideo.width=420; 
} 
</script>


播放/暂停
大的
小的
正常的


您的浏览器不支持HTML5视频。
var myVideo=document.getElementById（“video1”）；
函数playPause（）
{ 
如果（myVideo.paused）
myVideo.play（）；
其他的
myVideo.pause（）；
} 
函数makeBig（）
{ 
myVideo.width=560；
} 
函数makeSmall（）
{ 
myVideo.width=320；
} 
函数makeNormal（）
{ 
myVideo.width=420；
}

文件是否与请求的站点位于同一目录/路径下？请尝试在此处添加“自动播放”：。如果视频开始，则代码中有错误，否则问题是源视频不存在于html页面的同一文件夹中。@AlbertoFecchi我添加了自动播放，但仍然只看到一个黑屏。这些视频实际上位于“videos”文件夹下，我的源代码是“videos/mov_bbb.mp4”，因此在根文件夹中，您可以看到包含此代码的页面，在“videos”文件夹中可以看到mp4/ogg。在您指定的代码中，对吗？如果是这样，请尝试清除您的cache@AlbertoFecchi是的，没错。我将尝试清除缓存。如何编辑.htaccess文件？我使用的是Dreamweaver cs3和cpanel，但这个文件似乎是空的，这取决于您使用的是哪个网络主机提供商。在.htaccess所在的位置，应该在您的网络主机提供商的手册上。只需将这些行添加到.htacessi将这些行添加到.htaccess文件中，但什么也没有发生。请注意，此文件中没有其他内容