vue使用 video.js动态切换视频源视频源不刷新问题
网上的垃圾代码太多,最后翻了video.js的官方文档,就这么简单,浪费了我这么久,注:我这里使用的vue
//html
<video id="my-player" controls autoplay preload="auto" class="video-js vjs-big-play-centered vjs-fluid vjs-16-9 vjs-big-play-centered"
controls preload="auto" data-setup='{}'>
<source id='videoid' :src="videosrc" type="application/x-mpegURL">
</video>
//随便定义一个方法
<p @click="selectomit >点击我</p>
//vue methods里面
selectomit (){
var that = this;
that.videosrc = '你的路径';
console.log(that.videosrc);
var player=videojs('my-player');
console.log(player);
player.src({
src:that.videosrc
})
}
vue使用 video.js动态切换视频源视频源不刷新问题的更多相关文章
- vue使用video.js解决m3u8视频播放格式
今天被这个关于m3u8视频播放不了搞了一下午,这个项目所有的视频流都是m3u8格式的,后台给我们返回的都是m3u8格式的视频流,解决了好长时间,看了好多博客,只有这个博客给我点启发,去解决这个问题,请 ...
- vue基于video.js实现视频播放暂停---切图网
切图网是最早致力于PSD2HTML切图等web前端外包服务的,随着前端技术的更新迭代,现在也已经全面投入了vue的浪潮了,下面是vue中实现视频播放的方法. vue.js中引入video视频播放器 m ...
- video.js分段自动加载视频【html5视频播放器】
突发奇想的需求,要在官网上放一个一个半小时的视频教程…… 然而,加载成了问题,页面是cshtml的.net混合网站,不知道哪儿的限制,导致视频加不出来. 没有办法,只能前端想办法了. 于是将视频切割成 ...
- js 动态切换视频
如图所示,想要一个这样的效果,就是点击下面视频标题时,上面的视频跟着切换,但是要求页面不重新加载. 参考文章在这里 这里贴上部分代码供大家参考. <li id="about_li6&q ...
- js动态切换图片
<script language =javascript > $(function () { initAds(); }); function initAds() { var curInde ...
- video.js 应用于网站需要视频的
http://www.cnblogs.com/lechenging/p/3858181.html
- 微信 vue中使用video.js播放m3u8视频,解决安卓自动全屏的问题。
最近一个项目中需要在微信中播放m3u8格式的视频,刚开始用了 vue-video-player 这个插件,在IOS手机体验良好,本以为完事了, 结果安卓手机一点播放就自动全屏,心态略崩.查了资料说是安 ...
- 【vue】使用 Video.js 播放视频
目录 安装 引入 使用 参考文档 环境: vue 2.0+ element ui (这里的代码用了elmentui的按钮样式,可以不用elment ui的样式) 安装 在项目中安装 video.js. ...
- 前端视频直播技术总结及video.js在h5页面中的应用
全手打原创,转载请标明出处:https://www.cnblogs.com/dreamsqin/p/12557070.html,多谢,=.=~ (如果对你有帮助的话请帮我点个赞啦) 目前有一个需求是在 ...
随机推荐
- 2018-06-30 js事件
一.js代码加载的时机 1.DOM加载完毕 -> 将js代码放到body体之下即可: 2.网页资源加载完毕-> $(window).onload(function(){ }); 3.jQ ...
- 使用ultraISO制作U盘制作系统盘提醒:设备忙,请退出所有在运行的应用。
U盘很久没用,今天重装系统用ultraISO做系统盘提示如下: 本人解决方法如下:打开设备管理器,磁盘.看看磁盘是不是有200M的EFI没有格掉 因为磁盘管理没有权限格U盘,网上找个工具,我随手找个d ...
- 用一个python文件去调用另一个python文件,关于相对路径的处理?
比如用a.py调用执行b.py,但是a.py和b.py路径环境不一样,而b.py中有使用相对路径读取文件,这时会报错,怎么在a.py中进行配置,使其调用b.py时路径和其相同,能否做到? 比如目录结构 ...
- Sentinel源码解析四(流控策略和流控效果)
引言 在分析Sentinel的上一篇文章中,我们知道了它是基于滑动窗口做的流量统计,那么在当我们能够根据流量统计算法拿到流量的实时数据后,下一步要做的事情自然就是基于这些数据做流控.在介绍Sentin ...
- Failed to start mongod.service: Unit not found
其实自己用惯的是MYSQL,然后项目最后一步完善数据读写的部分,本来打算用mysql的,然而在centOS系统上发现安装总是出问题,后来查找一下资料,发现centOS系统上一般用的是Mariadb,这 ...
- 《机器学习_07_03_svm_核函数与非线性支持向量机》
一.简介 前两节分别实现了硬间隔支持向量机与软间隔支持向量机,它们本质上都是线性分类器,只是软间隔对"异常点"更加宽容,它们对形如如下的螺旋数据都没法进行良好分类,因为没法找到一个 ...
- nodejs server启动写法
http://www.phpstudy.net/c.php/18720.html node不利用框架怎么实现对静态HTML.css.js的服务? 初学nodeJS,在使用nodejs构建静态文件服务器 ...
- 基于Hdl Coder实现卡尔曼滤波算法
总所周知,FPGA极其不擅长复杂算法的运算,但是如果项目中又涉及一些高级算法的实现,在没有可封装IP核调用的形式下,我们应该如何进行程序开发呢?今夕已经是2020年,我们一味依赖于用verilog写代 ...
- 【Java】手把手理解CAS实现原理
先来看看概念,[CAS] 全称“CompareAndSwap”,中文翻译即“比较并替换”. 定义:CAS操作包含三个操作数 —— 内存位置(V),期望值(A),和新值(B). 如果内存位置的值与期望值 ...
- XXX_ProductCRUD的项目结构与配置文件
MVC_ProductCRUD Hibernate_ProductCRUD 项目结构 ...