将内联 Youtube API JavaScript 代码移动到单独的文件
Moving inline Youtube API javascript code to a seprate file
我有这个jsfiddle。
当我将脚本从上面板移动到下面板时,它不再起作用。为什么我不能使用 jQuery 来定位按钮?现在,我必须使用vanilla JavaScript,因为jQuery不起作用。
有什么想法吗?
在 JSFiddle 中,在左侧面板屏幕截图中,您可以选择放置脚本的位置。默认情况下,它包含在头部的onload
事件中。默认情况下,将加载 Mootools 库。
YouTube 播放器 API 无法使用默认设置的原因是,该 API 需要定义全局onYouTubePlayerAPIReady
事件。当代码包装在 onload
事件中时,该函数不再是全局函数。
解决方案是正确使用 JSFiddle:使用 no wrap (body)
和 jQuery 1.7.2
: http://jsfiddle.net/4WPmY/12/。
另一种解决方案虽然不如推荐的解决方案好,但通过将其设置为属性 window
来全局定义onYouTubePlayerAPIReady
:http://jsfiddle.net/4WPmY/13/
window.onYouTubePlayerAPIReady = function () {
在jsFiddle的左窗格中,在标题为"选择框架"的部分中,您需要将第一个设置更改为no wrap (body)
,以便在加载DOM后运行JS面板。如果希望使用该库,还应将第二个选项更改为jQuery 1.7.2
。
你的小提琴,更新:http://jsfiddle.net/Marcel/4WPmY/11/
相关文章:
- 将路由器配置放在Aurelia中的一个单独文件中
- 将另一个文件中的对象添加到单独文件中的阵列中
- 如何使用ngModel将自定义控件的提供程序扩展器分离到Angular 2中的单独文件中
- 我在哪里可以获得印度的.geojson文件,而不是每个州/地区的单独文件或任何其他区别
- 在单独文件夹/位置中的.js文件之间共享变量
- 在带有 html 的单独文件中实现 jQuery
- 如何制作d3.js饼图的单独文件并将其加载到html页面
- 使用在带有gulp和babel的单独文件中定义的ES6函数
- 单独文件中的Express中间件(multer)
- Node Express.js从单独文件中声明的路由访问变量
- 如何在react中将单独文件中的组件链接在一起
- 在angular js中的一个单独文件中定义应用程序
- 放置应用程序,控制器&单独文件中的服务
- Javascript连接文件的运行速度比单独文件慢
- 如何调用保存在单独文件中的javascript ?
- Ionic中单独文件中的控制器,包括order
- Gulp模块,可以提取