標籤：存在 box html 檔案的 set code 點擊 就會 mp3格式
利用點空閑時間來寫個部落格，最近做的項目中需要表單提交音訊，圖片的，各種類型，把它存到資料庫裡，這裡先來說一下音樂檔案的表單提交吧，後幾天再來更新輸入資料庫的，先看一下效果
點擊瀏覽
就會出來預覽，點擊mp3的檔案
開啟播放也可以正常播放
再來換一張圖片，試試能不能傳上
提交張圖片
點擊提交
提交不成功，因為這個只允許MP3格式的檔案提交
剛才還沒看mp3的提交，下面提交一下MP3檔案
點擊提交
因為沒有給它設定跳轉頁面，所以還在它的處理頁面
和圖片上傳的原理是一樣的，圖片上傳在我的前幾篇部落格中有，一樣得需要在自己的目錄下建立一個檔案夾
而提交的內容都得存入這個檔案夾中
看一下裡面有沒有剛才我們提交的MP3檔案
運行成功
如果再提交一遍的話還會有
點擊提交
看一下檔案夾裡
依然有。
下面來看一下我們這個的原始碼
先來看首頁面的
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>無標題文檔</title></head><script src="http://cdn.bootcss.com/jquery/1.11.1/jquery.min.js"></script><body><div class="box_input" style="margin-bottom: 20px;"> <form action="shiyancl.php" method="post" style="width: 960px;" enctype="multipart/form-data"> <input id="test" style="display: inline-block;" type="file" name="file"/> <audio id="audio" controls autoplay="" style="display: none; "></audio> <input type="submit" id="mp3_submit" style="display: none;margin-left: 25px;" type="button" value="提交"/> </form> </div></body><script> //錄音上傳 $(function () { $("#test").change(function () { var objUrl = getObjectURL(this.files[0]); $("#audio").attr("src", objUrl); $("#audio")[0].pause(); $("#audio").show(); $("#mp3_submit").show() getTime(); }); }); <!--擷取mp3檔案的時間 相容瀏覽器--> function getTime() { setTimeout(function () { var duration = $("#audio")[0].duration; if(isNaN(duration)){ getTime(); } else{ console.info("該歌曲的總時間為："+$("#audio")[0].duration+"秒") } }, 10); } <!--把檔案轉換成可讀URL--> function getObjectURL(file) { var url = null; if (window.createObjectURL != undefined) { // basic url = window.createObjectURL(file); } else if (window.URL != undefined) { // mozilla(firefox) url = window.URL.createObjectURL(file); } else if (window.webkitURL != undefined) { // webkit or chrome url = window.webkitURL.createObjectURL(file); } return url; } </script></html>
再來看它的提交頁面的代碼 檔案名稱是shiyancl.php
<?php//var_dump($_FILES["file"]); //索引寫它的name值//判斷檔案上傳是否出錯if($_FILES["file"]["error"]){ echo $_FILES["file"]["error"];}else{ //控制上傳檔案類型 if(($_FILES["file"]["type"]=="audio/mpeg" || $_FILES["file"]["type"]=="mp3/mp3") && $_FILES["file"]["size"]<500000) { //找到檔案存放的位置 $filename = "./file/".date("YmdHis").$_FILES["file"]["name"]; //加 . 拼接 //轉換編碼格式 $filename = iconv("UTF-8","gb2312",$filename); //判斷檔案是否存在 if(file_exists($filename)) { echo "該檔案已存在！"; } else { //儲存檔案 move_uploaded_file($_FILES["file"]["tmp_name"],$filename); //移動上傳檔案 } } else { echo "檔案類型不正確"; }}
再寫之前可以用var_dump輸出一下你要提交的東西
它就會給你返會資料類型什麼的
有些東西可以根據這個改
等我把其他功能做出來會繼續上傳的，希望會對大家有所協助
表單提交音樂檔案（php）
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
