vue中的video组件的currentTime不生效，设置完之后跳转0

最新推荐文章于 2024-03-28 09:37:08 发布
最新推荐文章于 2024-03-28 09:37:08 发布
阅读量758 收藏 11
点赞数 13
文章标签： vue.js 前端 javascript
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/zhaoyapeng_/article/details/135460590
版权

首先检查video组件的src是本地的资源（…/或者/开头的）还是远程的资源（http或者https开头的），chrome中video组件的file协议有问题，所有你要把你的src写成远程的资源

在这里插入图片描述

zhaoyapeng_
关注
  • 13
    点赞
  • 踩
  • 11
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
video，audio currentTime 失效无作用注意点 currentTime修改时间失败解决方法
王敬辉的博客
10-11 3769
video，audio currentTime 失效无作用 注意点 自己试着写video的控制台，在写拖动进度效果踩坑； 有引用Jquery，所以获取元素定义元素时都用的$("element")&&$element currentTime方法 是添加在video||audio单个元素上的.。 而JQ中$("element")&&$element获取的是数组对象， ...
vue-cli设置css不生效的解决方法
10-15
主要介绍了vue-cli设置css不生效的解决方法，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧
关于在谷歌浏览器，vue-video-player 实现断点续播，currentTime不生效问题
极北三少
08-06 1830
关于在谷歌浏览器，vue-video-player 实现断点续播，currentTime不生效问题
推荐开源项目：Vue-Video - 视频播放器组件库
最新发布
gitblog_00036的博客
03-28 494
推荐开源项目：Vue-Video - 视频播放器组件库 项目地址:https://gitcode.com/wunci/vue-video 在现代Web开发中，多媒体元素已经成为用户体验的重要组成部分。如果你正在寻找一个强大而灵活的视频播放器组件，Vue-Video 就是一个值得你关注的开源项目。它是一个专为Vue.js框架设计的，轻量级、可自定义的视频播放器。 项目简介 Vue-Video 是一个...
videojscurrenttime无效
milijiangjun的博客
09-22 2632
//添加视频准备完成后的回调函数 player.on('loadedmetadata', function() { player.play(); //自动播放 player.currentTime(100); //跳转 }); 我们 在更换视频地址后需要让视频跳转到某个位置，按理说使用currentTime()就可以解决，但是在player.src()函数执行后再执行player.currentTime()就会无效。 这
移动端video标签currentTime属性设置无效的解决方案
weixin_41614732的博客
04-17 6869
开发的时候遇到一个需求，需要视频在指定某一秒开始播放。 比如需要从第5秒开始播放视频，然后设置 var video = document.getElementsByTagName('video')[0]; video.currentTime = 5; video.play(); 然后发现pc端正常播放，移动端在浏览器则是重头开始播放，网上找了一些资料，使用了canplay 和loadedmeta...
移动端ios直接设置currentTime无效解决方法
qq_36611673的博客
04-18 4596
 var $myVideo = $("#chatAudio")[0];      if(isAndroid()){          //安卓        if(sessionStorage.currentTime > 0.1){              //设置播放时间              $myVideo.currentTime = sessionStorage.current...
Vue中视频组件vue-video-player
qq_43777572的博客
08-02 8064
Vue中视频组件vue-video-player
Vue 原始（传统）或特别的视频组件具体实现方法
Muxiu
05-29 1171
简单点的理解，就是没有点击就会暂停播放视频，还有忽略了音频，鼠标点击视频也不会停止，完全自循环播放，后面就是对这个视频进行灵活的前端排版了。
Vue2视频播放（Video）
热门推荐
Mr Dear的博客
10-10 3万+
Vue2简易封装的视频播放组件
Vue视频插件vue-video-player的使用
鹏多多的博客
09-06 1万+
有些项目中，或者是视频网站，都需要视频播放功能。我们可以用H5的video标签实现播放，但是原生的样子视频播放器不太好看，功能也需要自己封装。这时候可以站在巨人的肩膀上，使用已造好的轮子vue-video-player
vue中实现 【 Video视频进度条不能拖动，且能倍速播放 】，用vue-video-player插件，封装成组件的方法步骤
weixin_50450473的博客
12-07 1万+
一、安装vue-video-player 插件 npm install vue-video-player -S 二、引入 1、全局引入，main.js import VideoPlayer from 'vue-video-player' import 'vue-video-player/src/custom-theme.css' import 'video.js/dist/video-js.css' Vue.use(VideoPlayer) 2、局部引入 import { vide...
Vue切换组件实现返回后不重置数据,保留历史设置操作
10-15
主要介绍了Vue切换组件实现返回后不重置数据,保留历史设置操作，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧
vue 组件中添加样式不生效的解决方法
08-27
主要介绍了vue 组件中添加样式不生效的解决方法，小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧
解决vue addRoutes不生效问题
10-14
主要介绍了解决vue addRoutes不生效问题，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧
vue中更改数组中属性,在页面中不生效的解决方法
10-16
今天小编就为大家分享一篇vue中更改数组中属性,在页面中不生效的解决方法，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧
移动端 iOS 设置 video 的 currentTime 无效解决方法
MrQiu的博客
01-18 4774
需要记录视频的播放进度，重新进入时回到退出前的位置，并继续播放 但是ios直接赋值currentTime无效，原因就是判断资源可播放时（canplay）再设置才可以，，所以要根据不同系统判断一下，上代码 // 判断是否安卓设备 isAndroid() { const u = navigator.userAgent; if (u.indexOf('Android') > -1 || u.indexOf('Linux') > -1) { return true; } re.
[踩坑]移动端安卓微信浏览器video.currentTime设置无效
weixin_44945942的博客
04-29 3592
背景介绍： 项目需求是video的src是异步获取的，因此在移动端碰到了currentTime设置无效的问题。 原因大概是currentTime先赋值了，但是视频资源还没有加载完成。 网上搜了一些方法： var myPlayer = $("#player"); var userAgent_m = navigator.userAgent; if(userAgent_m.indexOf("iPhone...
使用videojs+vue2+elementui自定义播放器控件
weixin_52060703的博客
11-21 9510
用elementui的滑块实现视频自定义的进度条，包括一点videojs的初使用
div添加样式 vue_vue 组件中添加样式不生效的解决方法
05-24
在 Vue 组件中添加样式，可以使用 `style` 标签或者 `scoped` 属性来实现。 如果你使用的是 `style` 标签，但是样式没有生效，可能是因为样式被其他样式覆盖了。你可以尝试使用更具体的选择器或者使用 `!important` 来覆盖其他样式。 如果你使用的是 `scoped` 属性，但是样式也没有生效，可能是因为你的样式选择器中包含了子组件的选择器。在 `scoped` 属性中，Vue 会为每个组件生成一个唯一的 class 名称，以防止样式冲突。如果你的样式选择器中包含了子组件的选择器，那么子组件的 class 名称会被加入到样式选择器中，导致选择器无法匹配到正确的元素。解决方法是使用 `>>>` 或者 `/deep/` 符号来穿透子组件选择器。 例如，你有一个名为 `MyComponent` 的组件，你想要为它的子组件 `Button` 添加样式，你可以这样写： ```html <template> <div class="my-component"> <Button>Click me</Button> </div> </template> <style scoped> /* 不生效的样式 */ .my-component Button { color: red; } /* 生效的样式 */ .my-component >>> Button { color: red; } </style> ``` 或者： ```html <template> <div class="my-component"> <Button>Click me</Button> </div> </template> <style scoped> /* 不生效的样式 */ .my-component /deep/ Button { color: red; } /* 生效的样式 */ .my-component >>> Button { color: red; } </style> ```

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值