我写了一个M端播放音乐的组件，使用html5的audio标签

然后我使用watch监测currentSong

在浏览器中看到audio渲染的如下：

单独访问渲染出来的audio中url可以播放音乐，为什么调用：this.$refs.audioRef.play()方法不能播放音乐？

回答：ios? 如果是ios的话有限制。媒体的播放操作需要放在交互事件的回调函数里才能生效。

ios vue2.0使用html5中的audio标签不能播放音乐的更多相关文章

  1. html5 audio标签切换播放音乐的方法

    html5 audio标签切换播放音乐的方法<pre><audio id="music1" preload loop="loop">&l ...

  2. html5中的video标签和audio标签

    不管是否承认,flash早已不像过往那样如日中天了.亚马逊全面放弃flash.苹果放弃flash.安卓也放弃了移动端的flash支持.事实上flash已经不太适合web开发了,因为HTML5中的vid ...

  3. html5-8 如何控制html5中的视频标签和音频标签

    html5-8 如何控制html5中的视频标签和音频标签 一.总结 一句话总结:找到视频或者音频的element对象,然后查手册看对应的方法或者属性就可以,里面有控制的. 1.如何控制html5中的视 ...

  4. 检测是否支持HTML5中的Video标签

    //检测是否支持HTML5 function checkVideo() { if (!!document.createElement('video').canPlayType) { var vidTe ...

  5. 认识HTML5中的新标签与新属性

    前端之HTML5,CSS3(一) HTML5中常用内容标签 header标签 header标签定义文档的页眉,基本语法:<header>content</header>. na ...

  6. 让IE8支持html5中的video标签

    这是一篇综合几个前辈的解决方案. 使用video的时候,要遇到的问题. ①不兼容ie9及其以下版本 在<head>里添加两行, 参考张鑫旭前辈的博客,但是在ie8中薄播放. <!-- ...

  7. html5中的容器标签和文本标签

    html5中的容器标签和文本标签 html中的容器级标签和文本级标签,css中的块级元素和行内元素是我们常常拿来比较的四个名词(行内块级暂时先不考虑). 容器标签 容器级的标签可以简单的理解为能嵌套其 ...

  8. html5中的audio和video属性和事件汇总

    <audio> 标签属性: src:音乐的URL preload:预加载 autoplay:自动播放 loop:循环播放 controls:浏览器自带的控制 <video> 标 ...

  9. HTML5中的语义标签兼容IE8以及更低版本的浏览器

    看某教程,说让HTML5的这些语义标签能够兼容低版本的浏览器,原文是“你可以设置css的display属性为block”.很好理解,就设置css样式为block嘛,那就直接设置咯: header, s ...

随机推荐

  1. RESTful restful api Representational State Transfer

    通俗直白讲:REST是一种编写风格,一种API接口规范.它的风格就是将对象(如学生)的状态(如增删改查,API接口版本号等等)通过其他方式传递,API的接口地址突显出描述的对象. -- == REST ...

  2. 洛谷.4655.[CEOI2017]Building Bridges(DP 斜率优化 CDQ分治)

    LOJ 洛谷 \(f_i=s_{i-1}+h_i^2+\min\{f_j-s_j+h_j^2-2h_i2h_j\}\),显然可以斜率优化. \(f_i-s_{i-1}-h_i^2+2h_ih_j=f_ ...

  3. BZOJ.3811.玛里苟斯(线性基)

    BZOJ UOJ 感觉网上大部分题解对我这种数学基础差的人来说十分不友好...(虽然理解后也觉得没有那么难) 结合两篇写的比较好的详细写一写.如果有错要指出啊QAQ https://blog.csdn ...

  4. CODEVS 2455 繁忙的都市 SCOI2005（洛谷 P2330）

    题目描述 Description 城市C是一个非常繁忙的大都市,城市中的道路十分的拥挤,于是市长决定对其中的道路进行改造.城市C的道路是这样分布的:城市中有n个交叉路口,有些交叉路口之间有道路相连,两 ...

  5. [蓝点ZigBee] Zstack 之按键驱动以及控制LED灯 ZigBee/CC2530 视频资料

    这一节主要演示如何在Zstack 下根据板子的不同修改按键驱动,实际演示的时候代码跳动比较多,建议大家除了看视频资料以外,还需要在网上找一下相关资料进一步学习. 视频总览:http://bphero. ...

  6. MySql主键不区分大小写问题、查询不区分大小写问题

    一.问题一:MySql默认主键不区分大小写 实例: -- 创建混合类型 create table PlainText( Content nvarchar(50) , primary key(Conte ...

  7. nodejs,koa2常用模块

    "dependencies": { "multer": "^1.2.0", "node-schedule": " ...

  8. python 数据类型元组与字典内置方法

    1.元组 (1)元组是不可变的列表,能存多个值:如果多个值只有取得需求,没有改的需求,用元组最合理 (2)定义:在()内用逗号隔开,可以存任意类型的值 注意:当元组只有一个元素时,要在后面加逗号 # ...

  9. springboot的常见问题错误

    一: org.springframework.beans.factory.UnsatisfiedDependencyException: Error creating bean with name 2 ...

  10. Html图像标签、绝对路径和相对路径：

    Html图像标签: <img>标签可以在网页上插入一张图片,它是独立使用的标签,它的常用属性有: (1)src 属性 定义图片的引用地址 (2)alt 属性 定义图片加载失败时显示的文字, ...