PHP開發之簡單檔案上傳到MySql資料庫(二)

本節講解透過表單和表格來組合一個檔案上傳簡單前端頁面

<form> 標籤的 enctype 屬性規定了在提交表單時要使用哪種內容類型。表單需要二進位資料時,例如檔案內容,請使用 "multipart/form-data"。

<input> 標籤的 type="file" 屬性規定了應該把輸入當作檔案來處理。舉例來說,當在瀏覽器中預覽時,會看到輸入框旁邊有一個瀏覽按鈕。

這裡我們使用了<input type="hidden" >隱藏網域來限制上傳檔案的大小

<form>
    <input type="hidden" name="MAX_FILE_SIZE" value="2000000">
</form>

隱藏網域在頁面中對於使用者是不可見的,在表單中插入隱藏域的目的在於收集或傳送訊息,以利被處理表單的程式所使用。瀏覽者點擊傳送按鈕發送表單的時候,隱藏網域的資訊也被一起傳送到伺服器。

<table>標籤這裡使用了兩個屬性cellspacing cellpadding

單元格邊距(表格填充)(cellpadding) -- 代表單元格外面的一個距離,用於隔開單元格與單元格空間
單元格間距(表格間距)(cellspacing) -- 代表表格邊框與單元格補白的距離,也是單元格補白之間的距離

在這裡設定為cellspacing=0,cellpadding=0

下方顯示完整頁面程式碼:

<html>
<head>
 <meta charset="utf-8">
 <title>文件上传实例</title>
 <style type="text/css">
   <!--
   body
   {
     font-size: 20px;
   }
   input
   {
     background-color: #66CCFF;
     border: 1px inset #CCCCCC;
   }
   form
   {
    margin-top:5%;
   }
   -->
 </style>
</head>
<body>
 <form method="post" action="?action=save" enctype="multipart/form-data">
   <table border=0 cellspacing=0 cellpadding=0 align=center width="100%">
     <tr>
       <td width=55 height=20 align="center"></td>
       <td height="16">
 
         <table>
           <tr>
             <td>标题:</td>
             <td><input name="title" type="text" id="title"></td>
           </tr>
           <tr>
             <td>文件: </td>
             <td><label>
                 <input name="file" type="file" value="浏览" >
                 <input type="hidden" name="MAX_FILE_SIZE" value="2000000">
               </label></td>
           </tr>
           <tr>
             <td></td>
             <td><input type="submit" value="上 传" name="upload"></td>
           </tr>
         </table>
       </td>
     </tr>
   </table>
 </form>
</body>
</html>


繼續學習
||
<html> <head> <meta charset="utf-8"> <title>文件上传实例</title> <style type="text/css"> <!-- body { font-size: 20px; } input { background-color: #66CCFF; border: 1px inset #CCCCCC; } form { margin-top:5%; } --> </style> </head> <body> <form method="post" action="?action=save" enctype="multipart/form-data"> <table border=0 cellspacing=0 cellpadding=0 align=center width="100%"> <tr> <td width=55 height=20 align="center"></td> <td height="16"> <table> <tr> <td>标题:</td> <td><input name="title" type="text" id="title"></td> </tr> <tr> <td>文件: </td> <td><label> <input name="file" type="file" value="浏览" > <input type="hidden" name="MAX_FILE_SIZE" value="2000000"> </label></td> </tr> <tr> <td></td> <td><input type="submit" value="上 传" name="upload"></td> </tr> </table> </td> </tr> </table> </form> </body> </html>
關於我們 免責聲明 Sitemap
PHP中文網:公益線上PHP培訓,幫助PHP學習者快速成長!