有時候需要在頁面上允許用戶上傳多個文件,個數由用戶自己決定,個數多了也可以刪除,使用jQuery可以很簡單的實現這個功能。 效果如下: ...
有時候需要在頁面上允許用戶上傳多個文件,個數由用戶自己決定,個數多了也可以刪除,使用jQuery可以很簡單的實現這個功能。
<!DOCTYPE html> <html> <head> <title>test.html</title> <meta http-equiv="content-type" content="text/html; charset=UTF-8"> <script type="text/javascript" src="jquery-1.6.4.min.js"></script> <script type="text/javascript"> //添加一行<tr> function add() { var content = "<tr><td>"; content += "<input type='file' name='file'><input type='button' value='Remove' onclick='remove(this)'>"; content +="</td></tr>" $("#fileTable").append(content); } //刪除當前行<tr> function remove(obj) { $(obj).parent().parent().remove(); } </script> </head> <body> <form id="fileForm" action="" method="post" enctype="multipart/form-data"> <table id="fileTable"> <tr> <td> <input type="file" name="file"><input type="button" id="addButon" value="Add" onclick="add()"> </td> </tr> </table> </form> </body> </html>
效果如下: