//音频,写法一
<audio src="music/bg.mp3" autoplay loop controls>你的浏览器还不支持哦</audio>

//音频,写法二
<audio controls="controls">
<source src="music/bg.ogg" type="audio/ogg"></source>
<source src="music/bg.mp3" type="audio/mpeg"></source>
优先播放音乐bg.ogg,不支持在播放bg.mp3
</audio>

//JS绑定自动播放(操作window时,播放音乐)
$(window).one('touchstart', function(){
music.play();
})

//微信下兼容处理
document.addEventListener("WeixinJSBridgeReady", function () {
music.play();
}, false);

//小结
//1.audio元素的autoplay属性在IOS及Android上无法使用,在PC端正常
//2.audio元素没有设置controls时,在IOS及Android会占据空间大小,而在PC端Chrome是不会占据任何空间

微信video和audio无法自动播放解决方案的更多相关文章

  1. 在ios中微信video和audio无法自动播放解决方案

    WeixinJSBridgeReady页面初始化的时候会执行 document.addEventListener("WeixinJSBridgeReady", function ( ...

  2. 摇一摇—微信7.0.8版本audio无法自动播放问题

    近日有一个项目出现audio无法自动播放,查看原因才发现是微信版本更新为7.0.8版本,需要有交互行为,第一次播放需要用户手动点击一下,无法使用DOM中的play()进行直接播放操作,那怎么办呢? 通 ...

  3. 100%解决ios上audio不能自动播放的问题

    由于ios的安全机制问题,不允许audio和video自动播放,所以想要使audio标签自动播放那是实现不了的,即使给play()也是播放不了. 解决方法: 首先,创建audio标签:<audi ...

  4. 微信的audio无法自动播放的问题

    一.问题 最近做了一个html5的项目,里面涉及到音乐播放,项目要求音乐进入页面就自动播放,于是我就想到了html5的audio标签,将mp3引入进去. 1.在audio标签里引入了autoplay属 ...

  5. 解决audio和video在手机端无法自动播放问题

    各大浏览器都为了节省流量,做出了优化,在用户没有行为动作时(交互)不予许自动播放 <audio src="music/bg.mp3" autoplay loop contro ...

  6. 【转】解决chrome浏览器不支持audio和video标签的autoplay自动播放

    声音无法自动播放这个在 IOS/Android 上面一直是个惯例,桌面版的 Safari 在 2017 年的 11 版本也宣布禁掉带有声音的多媒体自动播放功能,紧接着在 2018 年 4 月份发布的 ...

  7. 解决 iOS 9.1 微信内置浏览器中html audio 不能自动播放的问题

    使用微信现在提供过的微信js-sdk 在ready中进行播放便可. 首先引用js : <script src="http://res.wx.qq.com/open/js/jweixin ...

  8. ios audio不能自动播放

    今天做了一个简单的落地页项目,就是类似于手机微信上经常看到的滑动效果.因为公司要求需要自己开发,所以我就用swiper+swiper.animate开发,开发速度很快,只不过最后音乐哪里出现了一点小b ...

  9. 解决在微信中部分IOS不能自动播放背景音乐

    前言在做各种HTML5场景页面的时候,插入背景音乐是一个很普遍的需求.我们都知道,IOS下的safari是无法自动播放音乐的,以至一直以来造成一种错误的认识,iso是无法自动播放媒体资源的.直到微信火 ...

随机推荐

  1. 【日常学习】【并查集+map】codevs2639 约会计划题解

    然而我居然让诸城一中悲剧机房的C++可以编译了··· 直接上题目 题目描写叙述 Description cc是个超级帅哥,口才又好.rp极高(这句话似乎降rp),又非常的幽默,所以非常多mm都跟他关系 ...

  2. 手机话费充值和手机流量充值 API

    最近正好需要用到手机充值和流量充值接口,网上找到的,记录并分享下. 聚合数据上面有手机充值的接口,也有流量充值的接口:注册以后可以使用它的OpenId和AppKey. 手机话费充值的接口:https: ...

  3. 笔记本中G-Sensor(加速计) M-Sensor 陀螺仪等传感器的区别

    1.G-sensor重力传感器 作用 G-sensor中文是加速度传感器的意思(英文全称是Accelerometer-sensor),它能够感知到加速力的变化,加速力就是当物体在加速过程中作用在物体上 ...

  4. ros学习网站

    ROS机器人操作系统入门-中国大学MOOC      https://www.bilibili.com/video/av24585414/?p=39 http://i.youku.com/i/UNDA ...

  5. 度度熊有一张网格纸,但是纸上有一些点过的点,每个点都在网格点上,若把网格看成一个坐标轴平行于网格线的坐标系的话,每个点可以用一对整数x,y来表示。度度熊必须沿着网格线画一个正方形,使所有点在正方形的内部或者边界。然后把这个正方形剪下来。问剪掉正方形的最小面积是多少。

    // ConsoleApplication10.cpp : 定义控制台应用程序的入口点. // #include "stdafx.h" #include <iostream& ...

  6. 链接脚本使用一例2---将二进制文件 如图片、MP3音乐、词典一类的东西作为目标文件中的一个段

    参考文章: <程序员的自我修养——链接.转载与库> P68 这里介绍两种方法,实现将将一张图片作为二进制可执行程序的一个段,其中第一种方法在我之前的博客中已经有所介绍,不过,那是采用的是交 ...

  7. js 第二篇 (DOM 操作)

    DOM 节点含有:元素节点,属性节点,文本节点. document.getElementById("id") //通过页面元素ID 值 捕获元素对象,得到的值为一个object 1 ...

  8. 关于ejabberd限制单点登录

    ejabberd 是对xmpp协议的完全实现,那么单纯的ejabberd是不提供该功能限制的,但是从我们的xmpp协议则可以完全的解决这个问题,我们通过jid对它进行限制,下面可以看一下jid的解释: ...

  9. erlang的timer定时器浅析

    timer作为其计时器: erlang的计时器timer是通过一个唯一的timer进程实现的,该进程是一个gen_server,用户通过timer:send_after和timer:apply_aft ...

  10. 模式识别之svm()---支持向量机svm 简介1995

    转自:http://www.blogjava.net/zhenandaci/archive/2009/02/13/254519.html 作者:Jasper 出自:http://www.blogjav ...