我写了一个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. 给有C或C++基础的Python入门 ：Python Crash Course 5 if语句

    本章就是Pyhon版的 if语句.原理大家都懂,就不一一说说明了. 值得注意的两点: 1. 在每个if类语句结尾必须加上符号“:”. 2. 注意,在python中是否缩进代表与上一行代码是否有关. 下 ...

  2. 51Nod.1766.树上最远点对(树的直径 RMQ 线段树/ST表)

    题目链接 \(Description\) 给定一棵树.每次询问给定\(a\sim b,c\sim d\)两个下标区间,从这两个区间中各取一个点,使得这两个点距离最远.输出最远距离. \(n,q\leq ...

  3. 函数指针的理解 from 数据结构

    今天在学习数据结构中遇到一些问题,函数的指针不知道怎么用,给自己科普一哈 1 int LocateElem_Sq(SqList L, LElemType_Sq e, Status(*Compare)( ...

  4. Django项目——CRM

    一.开发背景 由于公司人员的增多,原来通过excel表格存取方式过于繁琐,而且对于公司人员的调配和绩效考核等不能做到精确处理,所以开发crm系统,开始开发只是针对销售人员和客户,后面陆续加上一些操作, ...

  5. Android多线程的使用

    The speed and efficiency of a long-running, data-intensive operation often improves when you split i ...

  6. python系统编程（六）

    threading注意点 1. 线程执行代码的封装 通过上一小节,能够看出,通过使用threading模块能完成多任务的程序开发,为了让每个线程的封装性更完美,所以使用threading模块时,往往会 ...

  7. Android Studio 2.3 解决小米手机调试安装apk失败问题

    在开发者选项里面,拉到底,把miui优化选项去掉就好了. 参考资料 [问题反馈] Android Studio 2.3 在红米note3手机中 调试安装Apk失败

  8. Python标准库12 数学与随机数

    想用高斯分布生成随机数,在网上看到很强大的总结,保留一下,以备后用 https://www.cnblogs.com/vamei/archive/2012/10/26/2741702.html

  9. 常用的sort打乱数组方法真的有用？

    JavaScript 开发中有时会遇到要将一个数组随机排序(shuffle)的需求,一个常见的写法是这样: function shuffle(arr) { arr.sort(function () { ...

  10. 安装 VS2017 的正确姿势

    自从装了长城带宽,我的肠子就变成青色的了. 国内的网络环境,真的是有很大的不同,有的人装 VS 的时候,号称满速,有的人(其实就是我)要等它下载很久,还告诉我有个组件没有安装成功.很久很久以前,VS ...