1
複数のオーディオ要素に対してdivをクリックしたときにサウンドを再生するJqueryコードを記述しました。コードが動作するようですが（おそらく最も洗練された方法ではないでしょうが）、コンソールで次のエラーが発生しています。複数のhtml5オーディオ要素Jqueryエラー
"app.js：152 Uncaught（約束された）DOMException：play（）要求が新しいロード要求によって中断されました。"
私は、これが引き起こす可能性のある問題と、このエラーを取り除く方法の指針については疑問に思いますか？
JS
$('.speaker').on("click", function() {
var speakertriggered = $(this);
var speakerdata = speakertriggered.data('speaker');
var audioelement = $('#' + speakerdata);
var getaudio = $(audioelement)[0];
$(speakertriggered).addClass('speakerplay');
getaudio.load();
getaudio.play();
$(audioelement).on('ended', function() {
$(speakertriggered).removeClass('speakerplay');
});
});
HTML
<div class="speaker" data-speaker="left-player"></div>
<audio id="left-player">
<source src="assets/sounds/left.mp3" type="audio/mp3" />
<source src="assets/sounds/left.mp3" type="audio/ogg" />
</audio>
<div class="speaker" data-speaker="right-player"></div>
<audio id="right-player">
<source src="assets/sounds/right.mp3" type="audio/mp3" />
<source src="assets/sounds/right.mp3" type="audio/ogg" />
</audio>