用html播放音頻本地文件

但我不知道爲什麼我沒有得到這個東西的工作。這是codepen example：

$('input').on('change', function(e) { 

    var file = e.currentTarget.files[0]; 

    var reader = new FileReader(); 

    reader.onload = function(e) { 
    $('audio source').attr('src', e.target.result); 
    } 

    reader.readAsDataURL(file); 
});

源標籤正在接收的base64 MP3文件，但它不將文件加載到瀏覽器中。

來源

2016-07-08 Tomas Francisco

您設置src ATTR直接音頻元素上。 fiddle

var $audio = $('#myAudio'); 
 
$('input').on('change', function(e) { 
 
    var target = e.currentTarget; 
 
    var file = target.files[0]; 
 
    var reader = new FileReader(); 
 
    
 
    console.log($audio[0]); 
 
    if (target.files && file) { 
 
     var reader = new FileReader(); 
 
     reader.onload = function (e) { 
 
      $audio.attr('src', e.target.result); 
 
      $audio.play(); 
 
     } 
 
     reader.readAsDataURL(file); 
 
    } 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<input type="file"> 
 
<audio controls id="myAudio" autoplay></audio>

來源

2016-07-08 12:19:29

這個作品！這怎麼可能？我檢查過的每個源代碼都描述了src文件應該位於音頻標籤內的源標籤上，而不是音頻內。非常感謝！ –

有沒有辦法讓輸入允許多個文件，因此一次創建一個播放列表而不是一個文件？ – Lamar

<audio controls> 
<source src="yoraudio.ogg" type="audio/ogg"> 
<source src="youraudio.mp3" type="audio/mpeg"> 
Your browser does not support the audio element. 
</audio>

如需更多幫助，請訪問

This is the simplest way to play audio

來源

2016-07-08 12:18:47

在UWP可以播放的文件直接，您可以通過名稱從曲庫中得到如下圖所示。只需通過檢查項目屬性的「Capabilities」標籤中的庫，即可獲得訪問音樂庫的權限。

picksinglefile(); 
     var l = Windows.Storage.KnownFolders.musicLibrary; 
     var f = localStorage.getItem("alarmname").toString(); 
     l.getFileAsync(f).then(function (file) { 
      // storagefile file is available 
      var s = window.URL.createObjectURL(file); // its a storage file, so create URL 
      player1.setAttribute("src", s); 
      player1.play(); // if autoplay is false or off 
     }); 


function picksinglefile() { 
// Create the picker object and set options 
var fop = new Windows.Storage.Pickers.FileOpenPicker(); 
fop.suggestedStartLocation = Windows.Storage.Pickers.PickerLocationId.musicLibrary; 
fop.fileTypeFilter.replaceAll([".mp3", ".wav"]); 
fop.pickSingleFileAsync().then(function (file) { 
    if (file) { 
     localStorage.setItem("alarmname", file.name.toString()); 
    } else { 
     alert("Operation Cancelled"); 
    } 
});

來源

2017-09-20 12:48:09 pollaris

用html播放音頻本地文件

回答

相關問題