用embed标签在网页中嵌入avi格式的视频不能播放

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了用embed标签在网页中嵌入avi格式的视频不能播放相关的知识,希望对你有一定的参考价值。

下面是我做得网页的代码:

<html>
<head>
<title>无标题文档</title>
</head>

<body>
<embed src="JSP/video/DNFshow1.avi" width="385" height="258" type="application/x-mplayer2" autostart="true"></embed>
</body>
</html>

在我的机子上双击打开网页可以播放嵌入的视频,但是在地址栏输入地址通过Tomcat访问就不能打开视频了,不知道为什么,求解决!!!!

这个标签要区分浏览器的,IE下可以直接给文件路径,非IE浏览器,需要后台将文件以流的方式输出到页面 参考技术A 我也遇到了 特别奇怪 网上说可以 但是用了 就是不可以

HTML多媒体标签

在HTML中可以通过标签在网页中插入多媒体文件(包括:音频、视频、flash动画等等)。一般情况下,可以使用<embed></embed>标签对和<object></object>标签对。object多用与于IE浏览器,embed用于非IE浏览器。

一、embed标签

使用embed标签可以在网页中放置如SWF动画(即Flash动画)、MP3音乐、MPEG格式的视频和AVI格式的视频等多媒体内容。

语法格式:

<embed src=“文件地址”
height=“value”
width=“value”
hidden=“value”
autostart=“value”
loop=“value”>
</embed>
说明:
src:用于指明多媒体文件所在的路径,可以插入的常见的多媒体文件包括SWF动画、MP3音乐、MPEG格式的视频和AVI格式的视频。

height、width:设置多媒体播放的区域。

hidden:用于控制播放面板的显示和隐藏。当hidden=“true”时,隐藏面板;当hidden=“false”时,显示面板。

loop:用于设定播放的循环次数,loop取值不是具体的数字,而是true或false。true表示媒体文件无限次循环,false表示只播放一次。

autostart:用于控制多媒体内容是否自动播放。当autostart=“true”时,自动播放;当autostart=“false”时,不自动播放。
案例:
<!DOCTYPE html>
<html lang="zh-cn">
<head>
<meta charset="utf-8">
<title>多媒体标签</title>
</head>
<center>
<embed src="xihu.mp4" loop="true"
height="400px" width="800px"
hidden="false" autostart="true">
</center>
</body>
</html>

效果:

二、object标签

object标签用于向页面添加媒体对象,包括音频、视频以及flash等。object标签对o中包含param标签对,param标签用来定义播放参数。
object标签中包含属性width、height用来设定播放区域;属性classid用来用来告诉浏览器插件的类型;属性codebase可选,用来检测是否安装flash,未安装则跳转指定的Shockwave的下载页面。
param标签中包含着name属性以及value属性。name是一个param标签属性,而value是对应这个属性的值。
通常情况下,为了确保在IE以及非IE浏览器中都能够正常显示多媒体,可以采取embed和object标签并用的方法,即在object标签对中插入embed标签。

案例:

<!DOCTYPE html>
<html lang="zh-cn">
<head>
<meta charset="utf-8">
<title>多媒体标签</title>
</head>
<center>
<object width="800px" height="400px">
<param name="src" value="xihu.mp4">
<embed src="xihu.mp4" loop="true" height="400px"
width="800px" hidden="false" autostart="true">
</object>
</center>
</body>
</html>

效果:

HTML多媒体标签

三、HTML5中的音视频

1、音频

对于HTML5来说音频的添加可以直接用标签来处理,不需要借助第三方的插件。对于audio标签,支持“.mp3”、“.wav”和“.ogg”格式的音频文件。

语法格式:

<audio src=“xihu.mp3”controls=“controls”>
当前浏览器不支持HTML5:audio
</audio>

说明:

src:表示设置音频文件地址。

controls:表示是否设置控制台。

如果浏览器不支持HTML5,则显示:“当前浏览器不支持HTML5:audio”,不会显示控制条。

案例:

<!DOCTYPE html>
<html lang="zh-cn">
<head>
<meta charset="utf-8">
<title>多媒体标签</title>
</head>
<audio src="沈华夏%20-%20生活不止眼前的苟且(钢琴版).flac" controls="controls">
当前浏览器不支持HTML5audio
</audio>
</body>
</html>

效果:

HTML多媒体标签

2、视频

对于HTML5来说视频的添加可以直接用标签来处理,不需要借助第三方的插件。video标签支持三种视频文件,分别是:“.mp4”、“.webm”和“.ogg”。

基本格式:

<video src=“course.mp4”controls="controls">
浏览器不支持HTML5:video
</video>

案例:

<!DOCTYPE html>
<html lang="zh-cn">
<head>
<meta charset="utf-8">
<title>多媒体标签</title>
</head>
<center>
<video src="xihu.mp4" width="800px" height="450px" controls="controls">
浏览器不支持HTML5video
</video>
</center>
</body>
</html>

效果:

当然也可以通过javascript来控制视频播放

语法格式:

<video id=“myvideo”  width=“420”  controls="controls" >
<source src=“course.mp4”  type=“video/mp4”/>
浏览器不支持HTML5:video
</video>
<button onclick=“playpause()”  >播放暂停</button>

说明:

id:表示这块元素的名称,用于在JS中调用该元素。

width:表示设置视频窗口宽度。

controls:表示是否设置控制台。

Source:表示视频文件的来源。(多个source表示设置不同格式的视频,不是多个视频)

src:设置视频文件的地址。

type:设置视频格式。

文字部分:表示当浏览器不支持HTML5时,显示的提示文字。

button:表示按钮,onclick表示点击事件,后面跟的事件名称。(在JS中调用)

案例:

<!DOCTYPE html>
<html lang="zh-cn">
<head>
<meta charset="utf-8">
<title>多媒体标签</title>
</head>
<center>
<video id="myVideo" width="800px" height="400px">
<source src="xihu.mp4" type="video/mp4">
浏览器不支持HTML5video
</video><br/>
<button onclick="playPause()">播放/暂停</button>
</center>
<script>
var v = document.getElementById("myVideo");
function playPause() {
if(v.paused)
v.play();
else
v.pause();
}
</script>
</body>
</html>

效果:


以上是关于用embed标签在网页中嵌入avi格式的视频不能播放的主要内容,如果未能解决你的问题,请参考以下文章

html中用embed嵌入视频,怎么没有图像

手机无法播放网页上embed标签的视频

如何在网页中插入swf?

OpenCV中如何播放avi文件的音频

embed标签的使用(在网页中播放各种音频视频的插件的使用)

如何在 html 中嵌入 .AVI?