在手机上点击按钮即可播放HTML音频

Question

我正在尝试用HTML创建一个简单的键盘。 我了解在iOS和android上播放HTML音频存在一些限制，并且在使用它们时遇到了麻烦。

这是我到目前为止的内容，第一列基于此处的清单11，第二列是我之前的尝试。 它们都可以在台式机（Firefox和Chrome）上完美运行，但不能在iOS（Chrome或Safari）上完美运行。 我没有要测试的Android。 我该如何工作？

<head>
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap-theme.min.css" integrity="sha384-rHyoN1iRsVXV4nD0JutlnGaslCJuC7uwjduW9SVrLvRYooPp2bWYgmgJQIXwl/Sp" crossorigin="anonymous">
  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>
</head>

<body onload="loadScript();"style="background-color:#000000;">

  <script>
  function loadScript()
  {
    alert("ok");
    var button = document.getElementById('buttonD');
    var audio = document.getElementById('D');

    var onClickD = function() {
      audio.pause();
      audio.currentTime = 0;
      audio.play();
    };
    button.addEventListener('click', onClickD, false);
  }
  </script>

  <audio id="A" src="A.wav" preload="auto"></audio>
  <audio id="D" src="D.wav" preload="auto"></audio>


  <div class="row">
    <div class="col-md-6 col-sm-6 clickable">
      <button id="buttonD" style="height:100%;width:100%;"type="button" class="btn btn-primary">D</button>
    </div>
    <div class="col-md-6 col-sm-6 clickable">
      <button type="button"  onclick="document.getElementById('A').pause;document.getElementById('A').currentTime = 0;document.getElementById('A').play();" style="height:100%;width:100%;"type="button" class="btn btn-success">A</button>
    </div>

  </div>
</body>

Answer 1

您可以将HTML代码运行到Webview中。 因此，将webview用于HTML代码可以帮助您播放HTML音频。

用另一个音频文件更改A.wav并尝试。

<audio id="A" src="phonecall.mp3" preload="auto"></audio>
<audio id="D" src="phonecall.mp3" preload="auto"></audio>

在手机上点击按钮即可播放HTML音频

问题描述

1 个解决方案

解决方案1
0 已采纳 2017-12-21 04:21:32

在手机上点击按钮即可播放HTML音频

问题描述

1 个解决方案

解决方案1 0 已采纳 2017-12-21 04:21:32

解决方案1
0 已采纳 2017-12-21 04:21:32