同時上傳多個檔案的範例

edited 十月 2013 in Javascript
網址: http://pixelated-dreams.com/pages/multifileupload.html

程式碼:

1. <script type="text/javascript">
2. function addFileInput(input_name,container_id) {
3. var container = document.getElementById(container_id);
4. var newInput = document.createElement("input");
5. newInput.setAttribute('type','file');
6. newInput.setAttribute('name',input_name);
7. var random = Math.random();
8. var random = random * 10;
9. newInput.setAttribute('id','file_' + random);
10. window.inputId = 'file_' + random;
11. container.appendChild(newInput);
12. }
13.
14. function hideInput(listbox_id) {
15. var input = document.getElementById(window.inputId);
16. if (input.value != "") {
17. input.style.display = 'none';
18. addFileToList(listbox_id);
19. return true;
20. } else {
21. return false;
22. }
23. }
24.
25. function addFileToList(listbox_id) {
26. var input = document.getElementById(window.inputId);
27. var container = document.getElementById(listbox_id);
28. var newOption = document.createElement("option");
29. var newOptionText = document.createTextNode(input.value);
30. newOption.appendChild(newOptionText);
31. container.appendChild(newOption);
32. }
33.
34. function attachFile(listbox_id, input_name, container_id) {
35. if (hideInput('files')) {
36. addFileInput('files[]','file_attach');
37. }
38. }
39. </script>
40. <script type="text/javascript">
41. window.inputId = 'file_input';
42. </script>
43. <form action="/pages/multifileupload.html" method="post" enctype="multipart/form-data">
44. <p id="file_attach">
45. <select name="files" id="files" size="3" style="width: 20em;"></select>
46. <br />
47. <input type="file" name="files[]" id="file_input" />
48. </p>
49. <p>
50. <button type="button" onclick="attachFile('files', 'files[]', 'file_attach')">Attach!</button>
51. </p>
52. <p>
53. <input type="submit" name="submit" value="Upload Multiple Files!" /> (Does Nothing!)
54. </p>
55. </form>

原始討論: http://twpug.net/x/modules/newbb/viewtopic.php?topic_id=808

評論

Sign In or Register to comment.