https://www.cnblogs.com/sandraryan/

谷歌浏览器更新后禁止了autoplay功能，但是有时候可能会需要自动播放。

研究了一段代码。

<!DOCTYPE html>

<html lang="en">

<head>

  <meta charset="UTF-8">

  <meta name="viewport" content="width=device-width, initial-scale=1.0">

  <meta http-equiv="X-UA-Compatible" content="ie=edge">

  <title>Document</title>

</head>

<body>

  <audio src="" controls loop id="music"></audio>

  <script>

    //封装函数让谷歌浏览器自动播放

    function play() {

      var music = document.getElementById("music"); 
　　　　//判断如果音乐停止播放中，就让他播放。。。

      if (music.paused) {

        music.paused = false;

        music.play();

      }

    }
　　　//调用函数

    setInterval(play(), 1);

  </script>

</body>

</html>

就酱。

原生js设置audio在谷歌浏览器自动播放的更多相关文章

  1. audio标签的自动播放(ios)

    0.应用场景 前端移动端开发,经常有播放音乐的需求.比如我有公司做过类似支付宝的年度账单,功能是用户在查看年度账单的过程中播放轻音乐. 1.audio标签播放mp3 (一)常用属性和API介绍 1.c ...

  2. iphone在微信中audio 音频无法自动播放

    问题: Html5的audio 音频在电脑端和android端都可以实现自动播放,在iphone上无法实现,下面针对的是微信浏览器里面的解决方法 html代码: <div id="au ...

  3. 原生js文字标签云上下滚动播放

    效果:http://hovertree.com/texiao/js/25/ 效果图: 代码如下: <!DOCTYPE html> <html> <head>< ...

  4. 原生js设置rem

    使用rem是为了界面响应不同尺寸的手机,引入下面的方法就可以使用rem了. setFontSize: function (doc, win) { var docEl = doc.documentEle ...

  5. 在iOS微信浏览器中自动播放HTML5 audio(音乐)的2种正确方式

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

  6. egret 篇——关于ios环境下微信浏览器的音频自动播放问题

    前段时间公司突然想用egret(白鹭引擎)做一个金币游戏,大半个月边看文档边写吭哧吭哧也总算是弄完了.期间遇到一个问题,那就是ios环境下微信浏览器的音频自动播放问题. 个人感觉吧,egret自己封装 ...

  7. ios设置音乐audio自动播放

    因为audio标签的自动播放:autoplay.在ios系统中不能自动播放,此时需要设置,在进入页面自动播放音乐. 第一步,先引入js微信 <script src="js/jweixi ...

  8. ios audio不能自动播放

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

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

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

随机推荐

  1. QT_获取正在运行程序的进程id（判断程序是否正在运行）

    bool checkProcessRunning(const QString &processName, QList<quint64> &listProcessId) { ...

  2. Node.js概述1

    为什么我们要学习Node.js? 认为: Node.js就学习一周,时间比较短,不重要 将来工作我后端又不用Node.js做,我们又java/python/php/c,为什么要在意它 Node.js接 ...

  3. 强力Django+杀手级xadmin开发在线教育网站

    强力Django+杀手级xadmin开发在线教育网站采用 Python3.7全新开发 整个课程都看完了,这个课程的分享可以往下看,下面有链接,之前做java开发也做了一些年头,也分享下自己看这个视频的 ...

  4. Primitive Topology

    原文:Primitive Topology 版权声明:本文为博主原创文章,未经博主允许不得转载. https://blog.csdn.net/u010333737/article/details/78 ...

  5. 学习JDK1.8集合源码之--HashSet

    1. HashSet简介 HashSet是一个不可重复的无序集合,底层由HashMap实现存储,故HashSet是非线程安全的,由于HashSet使用HashMap的Key来存储元素,而HashMap ...

  6. 什么？ 1XIN = 21BTC

    什么? 1XIN = 21BTC 最初看到这个标题,我还回去考证一下. 原来是 Mixin Network 的宣传广告. BTC 是多少? 2100万枚. XIN 是 100 万枚. 所以才有了 1X ...

  7. switch或判断

    <?php $num1 = 1; $num2 = 2; function int($num){ switch($num){ case 1: case 2: echo "1或2" ...

  8. oracle dbms_repcat_admin能带来什么安全隐患

    如果一个用户能执行dbms_repcat_admin包,将获得极大的系统权限. 以下情况可能获得该包的执行权限: 1.在sys下grant execute on dbms_repcat_admin t ...

  9. Leetcode744.Find Smallest Letter Greater Than Target寻找比目标字母大的最小字母

    给定一个只包含小写字母的有序数组letters 和一个目标字母 target,寻找有序数组里面比目标字母大的最小字母. 数组里字母的顺序是循环的.举个例子,如果目标字母target = 'z' 并且有 ...

  10. Python2 生成器 简介

    1. A generator: provide a kind of function that can return an intermediate result ("the next va ...