我写了一个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. MySql基础笔记（三）其他重要的事情

    其他重要的事情 一)索引管理优化 1.把多条alter语句整合为一条 2.去除重复的索引 1)当一个索引的最左边部分包含到其他索引中时,被认定为重复索引 create table user( id i ...

  2. Android应用的内存管理

    管理应用的内存可以分为两个部分内容: 1. 首先需要理解:How Android Manages App Processes and Memory Allocation? 2. 其次需要考虑:我们设计 ...

  3. JsonServer服务环境搭建

    在前后端分离的这种工作模式下,分工明确,各司其职.前端负责展示数据,后端提供数据.然而,在这种过程中对于接口的规范 需要提前制定好.例如根据规范提前模拟数据,这个时候就比较麻烦的.JsonServer ...

  4. 【高精度&想法题】Count the Even Integers @ICPC2017HongKong/upcexam5563#Java

    时间限制: 1 Sec 内存限制: 128 MB Yang Hui's Triangle is defined as follow. In the first layer, there are two ...

  5. REST风格的增删改查（2）

    一.源码 1.页面 index.jsp <a href="emps">List All Employee</a> <br><br> ...

  6. pygame 笔记-7 生命值/血条处理

    通常游戏中的角色都有所谓的生命值,而且头顶上会有一个血条显示.生命值无非就是一个属性而已,很容易在Player.py类中增加,头顶上的血条其实就是绘制二个矩形,叠加在一起. 以上节的Player.py ...

  7. 使用cefsharp 浏览器放大

    (1)如果浏览器位置有问题,需要设置 Cef.EnableHighDPISupport(); (2)如果要放大浏览器,需要设置  browser.SetZoomLevel(1.25); Chromiu ...

  8. Scala编程基础

    Scala与Java的关系... 4 安装Scala. 4 Scala解释器的使用... 4 声明变量... 5 数据类型与操作符... 5 函数调用与apply()函数... 5 if表达式... ...

  9. MySQL监控全部执行过的sql语句

    MySQL监控全部执行过的sql语句 查看是否开启日志记录show variables like “general_log%” ; +——————+———-+|Variable_name|Value| ...

  10. [Canvas]空战游戏 已经可以玩了 1.13Playable

    空战游戏做到这里,己方运动,己方发射子弹,敌方运动,敌方发射子弹,子弹与飞机碰撞,飞机与飞机碰撞都已经具备了,换言之已经可以玩了. 还需要一个奖励升级系统,在上面显示击落敌机数量等,还有己方不幸被击落 ...