HTML5音频 - 只播放一次

问题描述：

<audio id="letter_audio" src="audio/bomb.mp3" type="audio/mp3" preload="auto"></audio> 

    $('.sound').live('click', function() { 

     var sound = $("#letter_audio")[0]; 

     sound.pause(); 
     sound.currentTime = 0; 
     sound.play(); 

     return false; 
    });

声音怎么来扮演我第一次点击播放。然后当我再次点击时，它会暂停，就像代码一样。但它只是暂停？我希望它可以播放，然后当我再次点击它时，回到0并再次播放代码？

嗨，你有没有找到解决方案？ – Lloyd 2012-02-21 12:34:14

哪个解决方案正在工作 – 2012-10-17 10:00:34

汤姆的解决方案添加sound.load（）为我工作 – kronuus 2013-03-08 16:55:07

答

试试这个..基本上，重置src属性应该根据需要重置音频。

$('.sound').live('click', function() { 

    var sound = $("#letter_audio")[0]; 

    sound.src = "audio/bomb.mp3"; 
    sound.play(); 

    return false; 
});

谢谢！这是有效的，但是...它看起来像每次你“改变”src时发送一个mp3请求。所以这有点贵 – Harry 2012-02-18 06:51:22

这并不昂贵 - 它很便宜..只有第一次点击激发任何网络活动..随后的点击直接在本地磁盘缓存中访问mp3 - 完全没有成本..请亲自参阅Chrome Dev Tools ，网络标签 – Lloyd 2012-02-18 09:58:51

是的，但他是对的。每次你*改变* src它会发送一个请求。 – kr1 2013-02-13 09:34:35

答

我已经重放音频类似的问题，但设法通过调用play()调用之前load()的方法来解决这个问题。试试这个：

$('.sound').live('click', function() { 
    var sound = $("#letter_audio")[0]; 

    sound.load(); 
    sound.play(); 

    return false; 
});

我觉得这是不是有两个原因重置src属性更好：

保持src值在页面内容，而不是在JavaScript

作品时您嵌入多个不同音频格式的<source>元素：

<audio id="letter_audio"> 
    <source src="audio/bomb.mp3" type="audio/mp3" preload="auto"/> 
    <source src="audio/bomb.ogg" type="audio/ogg" preload="auto"/> 
</audio>

适合我！谢谢！ – kronuus 2013-03-08 16:54:19

这是一个很好的解决方案，但我希望我能更好地理解问题的原因。 '.load（）'看起来像基于[MDN]（https://developer.mozilla.org/en-US/docs/Web/API/HTMLMediaElement#Methods）和[WHATWG]（https：// html）的矫枉过正。 spec.whatwg.org/multipage/media.html#loading-the-media-resource）的描述。如果在尝试播放（）后输出'sound.error'，则消息“无法发送音频数据包进行解码”。这听起来像是一个bug，但我能找到的东西都是非常松散的。 '.load（）'对于OGG文件不是必需的。 – Vince 2018-02-03 21:10:37

答

似乎暂时的currentTime的属性为只读（和在2011年已经得到了wont-fix status）

但是，（再次）你的音频对象上设置src后 - 像也被提出@Lloyd - currentTime属性可以设置（至少在linux的当前chrome版本（24.0.1312.69））。

这意味着通过添加行奇怪

audio.src = audio.src

您的例子做什么它应该。

完全

：

$('.sound').live('click', function() { 

    var sound = $("#letter_audio")[0]; 
    sound.src = sound.src; 
    sound.pause(); 
    sound.currentTime = 0; 
    sound.play(); 

    return false; 
});

，因为它是足够设置src一次，你可能想在安装过程中的某个地方调用它。

答

你可以使用php在URL的末尾添加一个查询time（）;

<source src="URLtoTrack.mp3?<?php echo time(); ?>" />

为我工作。

HTML5音频 - 只播放一次

相关推荐