不管在React或Vue中，将一个变量赋值给src属性，当修改这个变量的值时，video播放的还是原来的视频。

Vue中

<video id="root">

  <source :src="videoUrl" />

</video>

React中

<video id="root">

  <source src={videoUrl} />

</video>

动态修改videoUrl的值时，播放的视频，是不会跟着地址动态切换的，我们需要让video重新加载新的源(地址)，将新的地址，赋值给video的src属性，然后执行play()方法即可

let player = document.querySelector('#root') 
player.src = "新的地址" 
player.play()

Video标签动态修改src地址播放问题的更多相关文章

  1. 视频 embed标签动态改变Src的值，局部刷新播放其他视频的javascript方法

    看图: 视频处html代码: <div id="mod_player" class="mod_player"> <embed id=" ...

  2. HTML5 audio与video标签实现视频播放，音频播放

    随着互联网的飞速发展以及HTML5的应用,越来越多的项目中用到video,audio当常用标签. <audio> 标签属性 <audio src="song.mp3&quo ...

  3. C#正则表达式提取HTML中IMG标签中的SRC地址

    百度到的一个,这里就直接贴了 http://blog.csdn.net/smeller/article/details/7108502#comments 一般来说一个 HTML 文档有很多标签,比如“ ...

  4. ios video标签部分mp4文件无法播放的问题

    问题描述: 部分MP4文件在ios的微信浏览器中无法播放,点击播放后缓冲一下之后显示叉,而另外一些mp4文件正常,同时在安卓全部下正常. 分析: h264编码的压缩级别问题导致. 苹果官方文档中对 i ...

  5. a标签动态修改手机号跳到拨打界面

    <div class="primaryButton"> <a :href.stop="'tel:' + createData.salesPhone&qu ...

  6. 关于vue中的videoPlayer的src视频地址参数动态修改（网上一堆错误方法，被误导很久，自己找到了正确的方法，供大家借鉴）

    方法很简单:相信大家的问题应该是改变src的值吧,动态赋值这一步简单.this.playerOptions['sources'][0]['src'] 就是这一步解决提取src问题,主要部分用绿色框起来 ...

  7. h5的video标签

    在video标签中,我们可以使用属性:videoWidth & videoHeight,它获取的是video的宽度和高度(媒体本身). 虽然不能直接使用,但是可以通过计算宽高比得到 video ...

  8. html5 video标签如何禁止视频下载

    html5 video标签如何禁止视频下载 一.总结 一句话总结:bing方法给video对象绑定return false的匿名方法. 1.html5 video标签如何禁止视频下载? bing方法给 ...

  9. H5 video标签的属性

    35-video标签 video标签的属性 src: 用于告诉video标签需要播放的视频地址 autoplay: 用于告诉video标签是否需要自动播放视频 controls: 用于告诉video标 ...

随机推荐

  1. Web消息推送框架windows部署实践

    一.官方下载地址:https://www.workerman.net/web-sender 二.解压至任意目录下,双击start_for_win.bat,效果如下图: 三.打开Chrome浏览器访问: ...

  2. VB参考

    Open 语句: 能够对文件输入/输出 (I/O). Open pathname For mode [Access access] [lock] As [#]filenumber [Len=recle ...

  3. Python数据分析 之时间序列基础

    1. 时间序列基础 import numpy as np import pandas as pd np.random.seed(12345) import matplotlib.pyplot as p ...

  4. iOS UILanel 一些小实用

    UILabel *lab=[[UILabel alloc]initWithFrame:self.view.bounds]; //合并 lab.text=[NSString stringWithForm ...

  5. WebApplicationContext初始化的两种方式和获取的三种方式

    原博客地址:http://blog.csdn.net/lmb55/article/details/50510547 接下来以ContextLoaderListener为例,分析它到底做了什么? app ...

  6. 解决网页刷新时，隐藏div元素闪现问题

    最近项目遇到一个问题,需要对一个div中的元素设置根据不同的情况进行显示和隐藏. 因为默认该div是显示的,所以在刷新页面的时候,会先加载这个div进行显示,加载完成后又执行到 hide() 方法,使 ...

  7. 网络服务-SAMBA

    1. Samba 概述 SMB(Server Messages Block,信息服务块)是一种在局域网上共享文件和打印机的一种通信协议,它为局域网内不同操作系统的计算机之间提供文件及打印机等资源的共享 ...

  8. Linq入门学习

    千万别被这个页面的滚动条吓到!!! 我相信你一定能在30分钟之内看完它!!! 在说LINQ之前必须先说说几个重要的C#语言特性 一:与LINQ有关的语言特性 1.隐式类型 (1)源起 在隐式类型出现之 ...

  9. Linux系统下jar包的启动方式

    Linux 运行jar包命令如下: 方式一: Java -jar shareniu.jar 特点:当前ssh窗口被锁定,可按CTRL + C打断程序运行,或直接关闭窗口,程序退出 那如何让窗口不锁定? ...

  10. python应用-打印各种形状图

    row = int(input('请输入行数: ')) for row in range(1,row): for col in range (1,row+1): print( (col),end='' ...