javascript - 在 jQuery 中自动播放音频
问题描述
当我收到 ajax 响应时,我正在尝试根据条件自动播放音频。我收到response.code == 1
来自我的 ajax 调用,但它不播放音频。
<audio id="myAudio" >
<source src="{{asset('Dashboard/alarm.mp3')}}" type="audio/mpeg">
</audio>
$.ajax({
url: '{{url('/')}}',
type: 'POST',
data: {
_token: _token
},
dataType: 'json',
success: function(response) {
if (response.code == 1) {
playAudio();
}
}
});
function playAudio() {
var x = document.getElementById("myAudio");
x.play();
}
解决方案
浏览器通常会阻止不是由用户交互触发的声音,您可以在鼠标移动时开始播放音频,例如:
let isAjaxLoaded = false;
$(document).mousemove(function(){
if (isAjaxLoaded) {
playAudio();
}
});
$.ajax({
url: '{{url('/')}}',
type: 'POST',
data: {
_token: _token
},
dataType: 'json',
success: function(response) {
if (response.code == 1) {
isAjaxLoaded = true;
}
}
});
function playAudio() {
var x = document.getElementById("myAudio");
x.play();
}
推荐阅读
- c# - 解析值时遇到意外字符:T. Path '', line 0, position 0. 不更新数据库中的实体
- mysql - 如何根据其他两列的不同组合检查第三列中的匹配值?
- java - Java泛型在类字段和序列化上的变化
- java - Selenium with java - 需要点击一个按钮
- ?
- excel-formula - 需要 2 列的公式 (B & F) 整列需要公式
- mysql - Mysql 应用程序日志记录。通过删除旧日志来限制记录的行数
- android - “ANativeWindow_fromSurface”的对面
- sql - 仅从几乎相似的行中选择(显示)不同的列
- 3d - 切换投影矩阵后,vulkan给出了奇怪的结果
- flutter - 使用 image_picker 打开图片库时 iOS 应用程序崩溃