关于IE上embed自动播放-优快云博客

本文链接：https://blog.youkuaiyun.com/clumsyCoding/article/details/79907478

在维护的平台上，为了实现异常数据提醒功能，作者利用HTML标签播放音频。最初使用<video>标签，在360浏览器的极速模式和兼容模式下工作正常。然而在实际项目中遇到IE浏览器音频无法自动播放的问题。通过搜索发现需要html5media.js库，但因控制需求选择了<embed>标签。使用条件判断写入embed标签未成功，最终通过直接操作DOM元素实现音频的自动播放和暂停，例如：`var obj = $("#music")[0]; obj.Play(); obj.Pause();`

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

最近要给维护的平台添加一个功能：如果有异常数据请立刻提示，这里我就打算在页面加一段音频文件，如果有异常数据就播放这个音频文件，如果没有就不播放这个音频文件。最开始我用的是html5的<video>标签(这里没用audio标签当时没注意到)，我也随意的写了一个案例试了一下是可以的(公司项目用的是IE),这里给出案例：

<%@ page language="java" contentType="text/html; charset=utf-8"
    pageEncoding="utf-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>播放音频</title>
</head>
<body>
	<h1>播放音频</h1>
	<embed src="1.mp3"  width="320" height="240" autostart="true" loop="0" >
	</embed>
</body>
</html>

一个jsp页面，用360浏览器的极速模式和兼容模式都是可以打开并且播放的，效果如下：

video的具体用法可以看：点击打开链接

等我在项目中这么实现时，音频却不能播放了，百度了一下：得出结果为加一个js(html5media.js)，我添加之后好像是可以的，但是没有选择这个来写(要控制自动播放和暂停)。换了一个embed标签来完成的。给出代码：

	<c:if test="${muted eq 1 }">
	<embed id="music" hidden="true" src="../Flash/1.mp3" autostart="false" loop="true" >
	
	</embed>
	</c:if>
	
	
	<c:if test="${muted eq 0 }">
	<embed id="music" hidden="true" src="../Flash/1.mp3" autostart="true" loop="true" >
	
	</embed>
	</c:if>
	
	<!-- 设置音频文件 -->
		
	<div style="width:100%;">
		还剩 <font id="remainTime">10</font> 秒，进行刷新     
		<button οnclick="stopRepeat()" >停止</button>
		<button οnclick="continueRepeat()">继续</button>
		
		
		<div style="float:right;">
			 <c:if test="${muted eq 1 }">
			 	<input type="button" οnclick="mute(0)" value="恢复"    id="unmute"/>
			 	<input type="button"  value="静音" οnclick="mute(1)" style="display:none;"  id="mute"/>
			 </c:if>
				
			 <c:if test="${muted eq 0 }">	 
				 <input type="button" οnclick="mute(0)" value="恢复"  style="display:none;"    id="unmute"/>
			 	<input type="button"  value="静音" οnclick="mute(1)"   id="mute"/>
			 </c:if>	 
		</div>		
	</div>

这里设置：

autostart="false"

可以控制是否自动播放，loop也可以用正整数来填充(这里我用了0和负数，0可以播放1遍,负数是循环播放的)，代表循环的次数，但我第一次写法和这个不一样，导致了无论是否满足某条件，都是自动播放的(这里我要求当满足条件时，进行自动播放)，下面给出我原来的写法:

	<embed id="music" hidden="true" src="../Flash/1.mp3"  <c:if test="${muted eq 1}">autostart="false" </c:if> <c:if test="${muted eq 0}">autostart="true" </c:if> loop="true" >
	
	</embed>
	
	
	<!-- 设置音频文件 -->
		
	<div style="width:100%;">
		还剩 <font id="remainTime">10</font> 秒，进行刷新     
		<button οnclick="stopRepeat()" >停止</button>
		<button οnclick="continueRepeat()">继续</button>
		
		
		<div style="float:right;">
			 <c:if test="${muted eq 1 }">
			 	<input type="button" οnclick="mute(0)" value="恢复"    id="unmute"/>
			 	<input type="button"  value="静音" οnclick="mute(1)" style="display:none;"  id="mute"/>
			 </c:if>
				
			 <c:if test="${muted eq 0 }">	 
				 <input type="button" οnclick="mute(0)" value="恢复"  style="display:none;"    id="unmute"/>
			 	<input type="button"  value="静音" οnclick="mute(1)"   id="mute"/>
			 </c:if>	 
		</div>		
	</div>

这里不知道为什么条件判断写入标签中不能实现？不过最终还是将这个完成了。

注意在控制播放停止时，请先取出对象，不要用$("#")的模式,这样控制台会提示没用这个方法的

取出对象操作：var obj = $("#music")[0];

那么控制播放和停止分别是： obj.Play() 和 obj.Pause() , 当然具体的还得自己去了解。