使用
<embed>
和<object>
技术都可以实现,但它们都无法在视频播放失败或URL错误时调用回调函数(因此无法播放视频)。我正在使用此带有JavaScript的HTML代码来进行适当的回调:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>video test</title>
<script type="text/javascript">
function errorEncountered()
{
alert('Found error');
}
function loadingCompleted()
{
alert("loading completed");
//document.getElementById('youtubeObject').onerror="errorEncountered()";
//alert(document.getElementById('youtubeObject'));
}
function clickCompleted()
{
alert("Clicked on embedded object");
}
</script>
</head>
<body >
<div>
<object
id="youtubeObject"
type="application/x-shockwave-flash"
data="http://asdfasdf"
width="643"
height="400"
onload="loadingCompleted()"
onerror="errorEncountered()"
onclick="clickCompleted()">
<param name="movie" value="http://asdfasdf" />
<param name="onError" value="errorEncountered()" />
<!-- <param name="onload" value="loadingCompleted()" /> -->
<param name="allowScriptAccess" value="always" />
<param name="enablejsapi" value = "1" />
<p>
Couldn't load the video
</p>
</object>
</div>
<!-- document.getElementById('youtubeObject').onerror="errorEncountered()"; -->
<!-- document.getElementById('youtubeObject').addEventListener('onerror',function(){alert('error playing video')},true); -->
</body>
</html>
<!-- Actual Youtube URL "http://www.youtube.com/v/J_DV9b0x7v4" -->
用实际的YouTube URL替换错误的URL可以播放视频。但是错误的URL应该触发JavaScript函数,但这并没有发生。
我已经检查了
<object>
的文档和相应的事件。<object>
标记文档表示它响应的事件不包括onerror或onload。
但另一方面,onerror事件对象文档说明它被<img>
、<object>
、<script>
和 <style>
标记支持。因此,我尝试将“onerror”事件作为
<param>
传递给<object>
标记,并尝试将其作为<object>
标记的属性(只是试试手气)。对象的“onclick”属性会响应,但“onerror”和“onload”不会响应。我的问题是,为什么在传递带有onerror和onload的
<param>
到插件时,当传递错误的URL时不会触发?我尝试使用embed tag,但是使用embed标记无法附加onerror和onload处理程序。
是否有一种方法可以在HTML中从内部触发JavaScript函数(使用嵌入或对象技术),每当视频加载/播放失败时?
PS:我偶然发现了一些讨论此问题的链接,但没有一个解决方案,这就是为什么我开始提出这个新问题的原因,而且我正在为特定于iOS的情况做这件事。
http://www.webdeveloper.com/forum/showthread.php?t=590
感谢任何建议和帮助。
补充:
在<object>
和</object>
标签之间的替代内容将在iPad模拟器中显示内容,但不会在设备本身上显示。这是我难以解决的难题之一。
PS:我已经尝试过video
方法,对于特定的youtube视频,我尝试添加了onError
回调函数,但它从未触发!使用了正常的youtube指定方式,在其中我们可以为youtube插入onError
回调函数: https://developers.google.com/youtube/iframe_api_reference#Loading_a_Video_Player
以上问题是,我们必须创建一个YT.Player
并将视频ID设置为该对象。这将使播放来自其他来源的视频变得不可能。因此,使用了略微不同寻常的方法:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>video test</title>
<script type="text/javascript">
function errorEncountered(event)
{
alert('Found error');
}
function errorFound()
{
alert('Found error');
}
</script>
<script type='text/javascript' src='http://www.sandeshkadur.com/wp-content/themes/Gaia/js/video.js?ver=1.0'></script>
</head>
<body id="mainBody">
<iframe id = "youtube_vid" src="http://player.vimeo.com/video/28723846?color=ffffff" frameborder="0" width="640" height="360"></iframe>
<!-- From https://groups.google.com/forum/#!msg/youtube-api-gdata/myLe-SdMZ6w/tziw7W2LBv4J -->
<!-- <iframe id="youtube_vid" src="asdfasdf"></iframe> -->
<script>
var player = document.getElementById("youtube_vid");
new YT.Player(player, {
events: {
'onStateChange': function(){console.log(arguments)},
'onError': errorEncountered
}
});
</script>
</body>
</html>
尽管它能正确播放视频,但至少对于Youtube链接,它没有获取错误回调!