我写了一个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. java 分布式与集群的区别和联系（转）

    本文主要介绍了java分布式与集群的区别和联系,具有很好的参考价值,下面跟着小编一起来看下吧 一.先说区别: 一句话:分布式是并联工作的,集群是串联工作的. 1.分布式是指将不同的业务分布在不同的地方 ...

  2. 最近在搞gitlab发现2个不错的开发流程分享一下

    一个不错的gitlab开发流程 http://blog.51cto.com/sgk2011/1925922 不错的git开发流程 https://www.cnblogs.com/coderzl/p/7 ...

  3. Codeforces.888G.Xor-MST(Borůvka算法求MST 贪心 Trie)

    题目链接 \(Description\) 有一张\(n\)个点的完全图,每个点的权值为\(a_i\),两个点之间的边权为\(a_i\ xor\ a_j\).求该图的最小生成树. \(n\leq2*10 ...

  4. 2009 Putnam Competition B3

    2009 Putnam Competition B3 题目大意: \(T(t\le10^5)\)次询问,每次询问\(n(n\le2\times10^6)\)以内的正整数构成的集合,有多少满足若\(a\ ...

  5. JS简单实现滚动自动加载新内容（懒加载）

    加载源 // 这里存后台发来的数据 var galleryList = [ { src: "./images/1.jpeg", desc: "11111" }, ...

  6. async与await线程分配研究

    using System; using System.Collections.Generic; using System.Linq; using System.Text; using System.T ...

  7. Egret 按钮点击缩放效果

    非代码设计,exml直接操作 设计模式下选中对象,之后[源码],会直接定位到该对象在exml源码中的位置 width.down = "100%" 表示当按钮按下的时候宽度为 100 ...

  8. Java集合框架(简介明了)

    对于集合类,主要需要掌握的就是它的内部结构,以及遍历集合的迭代模式. 接口:Collection Collection是最基本的集合接口,一个Collection代表一组Object,即Collect ...

  9. Java 使用RMI

    Java 使用RMI Java使用序列化的方式,可以实现远端的方法调用,在分工合作时非常方便.本文记录使用java标准库实现rmi 一.服务端 结构 . ├── pom.xml ├── src │   ...

  10. openstack 之~keystone基础

    第一:keystone是什么? keystone是 OpenStack Identity Service 的项目名称,是一个负责身份管理验证.服务规则管理和服务令牌功能.它实现了openstack的i ...