我试图上传和播放歌曲与HTML5。我正在使用JavaScript将文件上传到服务器和jPlayer播放歌曲,但我遇到了这个插件的问题。上传和播放歌曲
这是我的代码:
$(document).ready(function() {
$(this)
.bind("dragenter", function(event) {
return false;
})
.bind("dragover", function(event) {
return false;
})
.bind("drop", function(event) {
var file = event.originalEvent.dataTransfer.files[0];
event.preventDefault();
$("#state").html("Loading...");
$.ajax({
url: 'upload.php',
async: true,
type: 'POST',
contentType: 'multipart/form-data',
processData: false,
data: file,
success: function(data) {
$("#state").html("Ready!");
$("#player").jPlayer({
ready: function() {
$(this).jPlayer("setMedia", {
oga: file.name
}).jPlayer("play");
},
supplied: "oga"
});
},
beforeSend: function(xhr) {
xhr.setRequestHeader("X-File-Name", file.name);
xhr.setRequestHeader("Cache-Control", "no-cache");
}
});
});
});
该文件上传到服务器上,但jPlayer不打它,我想不通为什么...
@vigrond:是我可以! ;)
<html id = "homepage">
<head>
<title>Echo</title>
<script type = "text/javascript" src = "http://ajax.googleapis.com/ajax/libs/jquery/1.7.0/jquery.min.js"></script>
<script type = "text/javascript" src = "jquery.jplayer.min.js"></script>
<script type = "text/javascript" src = "upload.js"></script>
</head>
<body bgcolor = "black">
<div style = "margin: 0 auto; text-align: center">
<h1 style = "margin-top: 100px; color: white">Drag and drop a song...</h1>
<h2 id = "state" style = "color: white"></h2>
</div>
<div id = "player"></div>
</body>
</html>
你能提供你的HTML吗?有几个步骤需要让jPlayer正常运行,并且正确的HTML元素就是其中之一。您可能还想尝试设置errorAlerts:true和warningAlerts:true。这通常会通过警报对话框为您提供有关正在进行的操作的具体信息。 – Vigrond
已编辑! 7更多去... –