Javascript 如何使用jQuery防止多个音频文件同时播放?
我是html/js领域的新手。我需要创建一个17张图片的非常基本的界面。每一个,当点击播放给定的声音 经过几天的修修补补和寻找正确的方法,我成功地创造了一些工作,看起来不错,但有一个小问题 当触发一个音频样本时,单击另一张图片应停止并重置上一张图片。我在这个网站上找到了很多例子,但我对js语法的理解太少,无法正确实现它 谢谢你的帮助 以下是我所拥有的:Javascript 如何使用jQuery防止多个音频文件同时播放?,javascript,jquery,audio,Javascript,Jquery,Audio,我是html/js领域的新手。我需要创建一个17张图片的非常基本的界面。每一个,当点击播放给定的声音 经过几天的修修补补和寻找正确的方法,我成功地创造了一些工作,看起来不错,但有一个小问题 当触发一个音频样本时,单击另一张图片应停止并重置上一张图片。我在这个网站上找到了很多例子,但我对js语法的理解太少,无法正确实现它 谢谢你的帮助 以下是我所拥有的: <script type="text/javascript" src="jquery-3.1.1.min.js"></scri
<script type="text/javascript" src="jquery-3.1.1.min.js"></script>
<script type="text/javascript">
$(document).ready( function() {
$('#track1').click(function() {
$('#1').append('<embed id="1" src="content/mp3/01.mp3" autostart="true" hidden="true"></embed>');
});
});
</script>
<img name="track1" src="content/img/01.jpg" width="180" height="180" border="0" id="track1" alt="" />
<div id="1"> </div>
$(文档).ready(函数(){
$('#track1')。单击(函数(){
$('#1')。附加('');
});
});
我非常感谢你的帮助 我从链接到你的帖子中清理了一点。尝试一下,看看它是否允许您播放和停止音频
$(文档).ready(函数(){
var audioElement=document.createElement('audio');
setAttribute('src','content/mp3/01.mp3');
$('#track1')。单击(函数(){
audioElement.pause();
audioElement.currentTime=0;
audioElement.play();
});
});代码>
也许,为了更清楚,我发布了更多的代码。整个站点由完全相同的“模块”组成,乘以17倍。情况如下:
<script type="text/javascript" src="jquery-3.1.1.min.js"></script>
<script type="text/javascript">
$(document).ready( function() {
$('#track4').click(function(){
$('#4').append('<embed id="4" src="content/mp3/04.mp3" autostart="true" hidden="true"></embed>');
});
});
</script>
<img name="track4" src="content/img/04.jpg" width="180" height="180" border="0" id="track4" alt="" />
<div id="4"> </div>
<script type="text/javascript" src="jquery-3.1.1.min.js"></script>
<script type="text/javascript">
$(document).ready( function() {
$('#track3').click(function(){
$('#3').append('<embed id="3" src="content/mp3/03.mp3" autostart="true" hidden="true"></embed>');
});
});
</script>
<img name="track3" src="content/img/03.jpg" width="180" height="180" border="0" id="track3" alt="" />
<div id="3"> </div>
$(文档).ready(函数(){
$('#track4')。单击(函数(){
$('#4')。附加('');
});
});
$(文档).ready(函数(){
$('#track3')。单击(函数(){
$('#3')。附加('');
});
});
看看这个。如果您的音频文件很小,这可能会奏效。这里还有一个游戏和一个停止选项。谢谢。不幸的是,这只适用于单个文件。这意味着,我不能播放同一文件的多个实例(这也是我想要实现的),当单击时,从一开始就启动文件。