2个脚本（FitVids.js，Vimeo.js）一起杀掉调用一个函数来播放视频，导致：VimeoAPI不是一个函数 [英] 2 scripts (FitVids.js, Vimeo.js) together kill Calling a function to play video, resulting in: VimeoAPI is not a function
问题描述
更新 ...
好的，我在这里遇到了问题。我正在使用这个优秀的vimeo课程让我的生活更轻松：
http：// www。 josh-ho.com/vimeo-class/
（源代码在这里： http://labs.josh-ho.com/vimeo/Vimeo.js ）
Ok, ive got a problem here. Im using this excellent vimeo class to make my life easier: http://www.josh-ho.com/vimeo-class/ (source code here: http://labs.josh-ho.com/vimeo/Vimeo.js)
我将它与fitvids.js一起使用，太棒了，在这里找到：
http://fitvidsjs.com/
（源代码这里： https://raw.github.com/davatron5000 /FitVids.js/master/jquery.fitvids.js)n
i use it together with the fitvids.js, which is sooo great, found here: http://fitvidsjs.com/ (source code here: https://raw.github.com/davatron5000/FitVids.js/master/jquery.fitvids.js)n
问题是，在firefox（OSX，还没试过WIN，但可能会，我使用fitvids.js时，它会打破vimeoAPI，因此我无法获取事件或告诉Vimeo.js播放视频，也不能阻止它。在Safari中按预期（和想要）工作，但是...
problem is, in firefox (OSX, havent tried WIN yet, but probably will, too) it breaks the vimeoAPI as soon i use fitvids.js, so i cant get events or tell Vimeo.js to play the video, nor stop it. Works as expected (and wanted) in Safari, though...
我知道它必须与fitvids.js放入我的div（在我的对象swf播放器所在的另一个div：
i know it must have sth to do with the fact that the fitvids.js puts my div (in which my object swf player is in) in another div:
之前：
<div id="flashposition">
<object width="1280" height="720" type="application/x-shockwave-flash"
id="flashpositionmyFlashID" data="http://www.vimeo.com/moogaloop.swf"><param
name="swliveconnect" value="true"><param name="fullscreen" value="1"><param
name="allowscriptaccess" value="always"><param name="allowfullscreen" value="true">
<param name="wmode" value="transparent"><param name="flashvars" value="clip_id=35083232&
amp;server=vimeo.com&show_title=false&show_byline=false&show_portrait=0&
amp;fullscreen=true&js_api=1&js_onLoad=vimeo.vimeoLoaded&color=00adef&
amp;wmode=transparent"></object>
</div>
之后：
<div id="flashposition">
**<div class="fluid-width-video-wrapper" style="padding-top: 56.25%;">**
<object width="1280" height="720" type="application/x-shockwave-flash"
id="flashpositionmyFlashID" data="http://www.vimeo.com/moogaloop.swf"><param
name="swliveconnect" value="true"><param name="fullscreen" value="1"><param
name="allowscriptaccess" value="always"><param name="allowfullscreen" value="true">
<param name="wmode" value="transparent"><param name="flashvars" value="clip_id=35083232&
amp;server=vimeo.com&show_title=false&show_byline=false&show_portrait=0&
amp;fullscreen=true&js_api=1&js_onLoad=vimeo.vimeoLoaded&color=00adef&
amp;wmode=transparent"></object>
</div>
**</div>**
是一个函数
XXX.play.video();
调用
vimeoAPI.api_play();
vimeoAPI 定义为：
vimeoAPI = document.getElementById( vimeoContainer ).getElementsByTagName( "object" )[0];
vimeocontainer id在我的例子中说是div idflashposition。
vimeocontainer id say is in my example the div id "flashposition".
所以我的猜测是它无法访问api因为这个新的div有class =fluid-width-video-wrapper。
So my guess is that it cant access the api because there is this new div with class="fluid-width-video-wrapper".
那么我如何更改vimeoAPI以使其再次运行（如果这是罪魁祸首）？
So how do i have to change vimeoAPI to get it working again (if this is the culprit)?
很多，非常感谢提前！
更新
此代码现在可在Firefox中使用，但仅限于我将页面留给不同的URL（通过停留在同一浏览器窗口中），然后按后退按钮。然后 的所有内容都在工作，vimeo API启动并运行。
但是我现在如何解决这个问题呢？
The code works now in Firefox, but only if I leave the page to a different URL (by staying in the same browser window) and then pressing the back button. then everything is working and the vimeo API up and running. But how do I fix this now?
下面是更新的代码，它让我走得那么远：
Heres the updated code that got me that far:
fitvids期望纯粹的宽度和高度，而不是添加px。所以我从第137-138行的Vimeo.js代码中删除了它，结果是：
fitvids expects pure width and height, not with px added. So I stripped that from the Vimeo.js code in line 137-138, resulting in:
playerWidth = ( width.toString().search( 'px' ) != -1 || width.toString().search( '%' )
!= -1 ) ? width.toString() : width;
playerHeight = ( height.toString().search( 'px' ) != -1 || height.toString().search( '%'
) != -1 ) ? height.toString() : height;
然后我换了
this.vimeoLoaded = function() {
var NEWcontainer = vimeoContainer + "NEW";
$('.fluid-width-video-wrapper').attr('id', NEWcontainer);
$(document.getElementById( vimeoContainer ).getElementsByTagName( "object" )).attr('id',
NEWcontainer);
container = NEWcontainer;
vimeoAPI = document.getElementById( vimeoContainer ).getElementsByTagName( "object" )
[0];
setupAddEventListener();
jQuery(document.getElementById( vimeoContainer )).fitVids();
dispatchEvent( this.VIMEO_LOAD_COMPLETE, null );
}
最后正常调用Vimeo.js类：
and finally called Vimeo.js class as normal:
var vimeo;
vimeo = new Vimeo( "flashposition", 1280, 720, "vimeo", showTitle=false);
vimeo.loadVideo( '35083232' );
vimeo.addEventListener( vimeo.VIMEO_LOAD_COMPLETE, video1Loading );
function video1Loading() {
vimeo.playVideo();
}
这种方式有效，但只有当按下后退按钮时...： - （
This way it "works", but again, only when pressing the back button... :-(
推荐答案
在vimeo之前初始化fitvid（因为它更改了DOM）并在新的内部div上初始化vimeo 。
Initialize fitvid before vimeo (since it changes the DOM) and initialize vimeo on the new inner div.
$(document).ready(function() {
var $div = $("#flashposition");
$div.fitVids();
// grab the new div and give it an id (for vimeo to find)
var vimeoID = 'vimeoPlayer';
$div.children('div.fluid-width-video-wrapper').attr('id', vimeoID);
// vimeo is not a jquery plugin and searches DOM by id
var vimeo = new Vimeo(vimeoID, 480, 320, "vimeo");
//....
vimeo.playVideo();
});
这篇关于2个脚本（FitVids.js，Vimeo.js）一起杀掉调用一个函数来播放视频，导致：VimeoAPI不是一个函数的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
