//音频,写法一
<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. require.js 使用

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  2. rename命令

    rename命令用字符串替换的方式批量改变文件名. 语法 rename(参数) 参数 原字符串:将文件名需要替换的字符串: 目标字符串:将文件名中含有的原字符替换成目标字符串: 文件:指定要改变文件名 ...

  3. apue学习笔记(第七章 进程环境)

    本章将了解进程的环境. main函数 C程序总是从main函数开始执行,main函数的原型是: int main(int argc,char *argv[]); 其中,argc是命令行参数的数目,ar ...

  4. Archlinux休眠设置

    2017-03-11 更新: 优化部分文字描述; 默认情况下禁用 swap 分区, 当执行休眠操作时先启用 swap 分区, 然后再执行休眠操作(给 /usr/bin/{swapon,swapoff} ...

  5. webstrom 代码工具(转http://www.cnblogs.com/tangdanni11/p/5149063.html)

    Emmet的前身是大名鼎鼎的Zen coding,如果你从事Web前端开发的话,对该插件一定不会陌生.它使用仿CSS选择器的语法来生成代码,大大提高了HTML/CSS代码编写的速度,比如下面的演示: ...

  6. Linux远程无密码登陆并远程执行脚本

    假设 A (192.168.20.59)为客户机器,B(192.168.20.60)为目标机: 要达到的目的: A机器ssh登录B机器无需输入密码: 加密方式选 rsa|dsa均可以,默认dsa ss ...

  7. hibernate批量更新和删除数据

    批量处理  不建议用Hibernate,它的insert效率实在不搞,不过最新版本的Hibernate似乎已经在批量处理的时候做过优化了,设置一些参数如batch_size,不过性能我没有测试过,听说 ...

  8. POJ3009 Curling 2.0(DFS)

    迷宫问题求最短路. 略有不同的是假设不碰到石头的话会沿着一个方向一直前进,出界就算输了.碰到石头,前方石头会消失,冰壶停在原地. 把这个当作状态的转移. DFS能够求出其最小操作数. #include ...

  9. 【转】【Pycharm大全】

    感谢:陈俊岭的程序员之路 [Pycharm大全]:http://blog.csdn.net/u013088062/article/details/50388329

  10. 【bootstrap】右侧sidebar不跟着内容滚动的异常

    移动开发需要依赖于Web服务的接口,但是写这个接口文档实在是比较繁琐,所以今天我就写了个包解析程序自动生成接口文档. 内容显示我是借鉴Bootstrap的官方教程http://v3.bootcss.c ...