HTML5音頻 - 只播放一次

我使用Chrome，這是我的代碼：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並再次播放代碼？

來源

2012-02-17 Harry

嗨，你有沒有找到解決方案？ – 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; 
});

來源

2012-02-18 00:19:01 Lloyd

謝謝！這是有效的，但是...它看起來像每次你「改變」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>

來源

2012-03-23 16:04:53 Tom

適合我！謝謝！ – 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一次，你可能想在安裝過程中的某個地方調用它。

來源

2013-02-13 09:35:15 kr1

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

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

爲我工作。

來源

2013-03-04 16:34:19 A1exB1

HTML5音頻 - 只播放一次

回答

相關問題