當前位置:首頁 » 文件傳輸 » 上傳多個文件
擴展閱讀
webinf下怎麼引入js 2023-08-31 21:54:13
堡壘機怎麼打開web 2023-08-31 21:54:11

上傳多個文件

發布時間: 2022-03-04 23:45:25

㈠ 利用多個input上傳多個文件,伺服器怎麼處理

第一,客戶端是沒辦法完成遍歷本地文件夾的。用JS做這個操作不現實。
第二,你上傳,也是先傳到本地伺服器,再通過FTP的方式用程序傳到FTP伺服器上去。這是兩個步驟。

㈡ 如何通過js完成多個文件的上傳

HTML5 file組件的新屬性
accept : 如果在file組件中增加這個屬性就可以直接控制上傳的文件類型了,實在是很方便。
multiple:是否允許選擇多個文件
HTML5 頁面代碼修改後

<img width="400" height="250"/><br />
<input type="file" id="pic" name="pic" onchange="printFileInfo()" accept="image/*" multiple="multiple"/>
<input type="button" value="上傳圖片" onclick="uploadFile()" /><br />
<div id="parent">
<div id="son"></div>
</div>

accept 的值可以參閱:IANA MIME 類型(標准 MIME 類型的完整列表),如果使用的是DW開發的話,軟體本身就有提示。
如果選擇了多個文件,可以用JS做循環列印,看看文件的名稱,類型和大小,看演示代碼

function printFileInfo(){

var picFile = document.getElementById("pic");
var files = picFile.files;
for(var i=0; i<files.length; i++){
var file = files[i];
var div = document.createElement("div")
div.innerHTML = "第("+ (i+1) +") 個文件的名字:"+ file.name +
" , 文件類型:"+ file.type +" , 文件大小:"+ file.size
document.body.appendChild( div)
}
}

既然可以循環多文件的話,就可以嘗試多文件上傳了。
1、首先創建 XMLHttpRequest 對象
//這是全局變數。因為是示例,所以就沒有判斷瀏覽器類型,低版本IE這么寫的話會出問題的
var xhr = new XMLHttpRequest()
2、上篇介紹了進度事件(Progress) , 這次實現 progress 和 error 2個事件
error:在請求發生錯誤時觸發。
對應上傳時發生錯誤導致的上傳失敗:uploadFailed()
//上傳失敗
function uploadFailed(evt) {
alert("上傳失敗");
}
progress:在接收相應期間持續不斷觸發。

對應上傳進度方法:onprogress()
/**
* 偵查附件上傳情況 ,這個方法大概0.05-0.1秒執行一次
*/
function onprogress(evt){
var loaded = evt.loaded; //已經上傳大小情況
var tot = evt.total; //附件總大小
var per = Math.floor(100*loaded/tot); //已經上傳的百分比
$("#son").html( per +"%" );
$("#son").css("width" , per +"%");
}

最後就是上傳方法了,注意上面的html代碼中上傳用的方法也需要改成這個uploadFile()方法才能正常使用。

//上傳文件
function uploadFile() {
//將上傳的多個文件放入formData中
var picFileList = $("#pic").get(0).files;
var formData = new FormData();
for(var i=0; i< picFileList.length; i++){
formData.append("file" , picFileList[i] );
}

//監聽事件
xhr.upload.addEventListener("progress", onprogress, false);
xhr.addEventListener("error", uploadFailed, false);//發送文件和表單自定義參數
xhr.open("POST", "upload");
//記得加入上傳數據formData
xhr.send(formData);
}

㈢ html有關多個文件上傳

//改好了沒問題..加文件試試
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />

<script type="text/javascript">

function imgChange(next) {
if(next != null)
document.getElementById(next).style.display = "";
}

function validate() {
var phos = 2;
for(i = 0; i < 2; i++) {
if($("del" + i).checked == true)
phos--;
}
for(i = 0; i < 4; i++) {
if($("photoFile" + i).value != "")
phos++;
}
if(phos > 4) {
alert("圖片太多,您最多總共可以保存4張圖片!");
return false;
}
return true;
}
</script>

<form action="/addTrade.do" method="post" enctype="multipart/form-data" onSubmit="return validate()">
<!-- 上傳照片-->
<div>

<table width="100%" border="0" cellspacing="0" cellpadding="0"
summary="upload pictures">
<tr id="tr_photoFile0">
<td width="119" align="right" class="title">
上傳照片:
</td>

<td width="499">
<input type="file" name="photoFile0" id="photoFile0"
size="40" onChange='return imgChange("tr_photoFile1")' />
</td>
</tr>
<tr id="tr_photoFile1" style="display: none;">
<td>

</td>
<td>

<input type="file" name="photoFile1" id="photoFile1"
onChange='return imgChange("tr_photoFile2")' size="40" />
</td>
</tr>
<tr id="tr_photoFile2" style="display: none;">
<td>

</td>
<td>
<input type="file" name="photoFile2" id="photoFile2"
onChange='return imgChange("tr_photoFile3")' size="40" />

</td>
</tr>
<tr id="tr_photoFile3" style="display: none;">
<td>

</td>
<td>
<input type="file" name="photoFile3" id="photoFile3"
onChange='return imgChange(null)' size="40" />
</td>

</tr>
</table>
</div>

<!--/ 上傳照片-->
<input name="submit" type="submit" value="提交"/>
</form>

㈣ 百度雲能不能同時上傳多個文件

可以同時上傳多個文件。把你需要上傳的文件全部選定,然後就會被依次上傳,希望可以幫到你

㈤ FTP可以一次上傳多個文件嗎

很難明白你的意思, 上傳的時候直接吧所有文件拖到上傳的界面就可以上傳了,或者一個個上傳都是可以的,不懂你的放在一個域名是什麼意思,文件都是放在文件夾下面的

㈥ file控制項怎麼上傳多個文件

File控制項是一個必須結合伺服器端功能才能實現的純客戶端控制項。

要使得文件上載能夠成功,要做到以下幾點:

INPUT type=file 元素必須出現在 FORM 元素內。
必須為 INPUT type=file 元素指定 NAME 標簽屬性的值。
FORM 元素 METHOD 標簽屬性的值必須設置為 post。
FORM 元素 ENCTYPE 標簽屬性的值必須設置為 multipart/form-data。
要處理上載到伺服器的文件,伺服器端進程必須可以處理 multipart/form-data 的提交。例如,Microsoft Posting Acceptor 能夠允許 Microsoft Internet Information Server (IIS) 接受文件上載。而在網上也可找到其它的 Common Gateway Interface (CGI) 腳本用於處理 multipart/form-data 提交。

用戶選擇要上載的文件並提交頁面後,該文件作為請求的一部分上載。文件將被完整地緩存在伺服器內存中。

File控制項一次只能上傳一個文件,並且其文件屬性值都是只讀的。採用File控制項同時上傳多個文件,實際上是動態生成多個File控制項,每選擇上傳一個文件,隱藏該控制項,生成另一個File控制項。這里只需要簡單的JavaScript技巧既可以實現,所以不做贅述。

以ASP.NET為例,介紹在伺服器端所需要進行的處理。

//獲取上傳文件列表

HttpFileCollection fileCollection = HttpContext.Current.Request.Files;

//逐個上傳每個文件
for (int index = 0; index < HttpContext.Current.Request.Files.Count; index++)
{
HttpPostedFile postedFile = HttpContext.Current.Request.Files[index];
filename = postedFile.FileName;
if (postedFile.FileName != "")
{
postedFile.SaveAs(uploadPath);
}
}

㈦ 論文指導如何上傳多個文件

一般選擇文件的時候按住ctrl鍵然後選擇,可以選擇多個,但是有的不可以,因為網站機制限制一次只能傳一個,有的網站也可以拖拽文件達到上傳多個文件

㈧ 怎麼能把多個文件夾的圖片一起上傳

新建一個文件夾,將多個圖片復制進來,然後壓縮這個文件夾,之後,就可以上傳了。補充:用搜索命令,在查找文件區域,給出指定范圍,這樣可以一下子查到你要上傳的多個圖片。

㈨ 怎麼在form里分別上傳多個文件,如圖

可以用iframe上傳,orm表單的method、 enctype屬性必須和下面代碼一樣。然後將target的值設為iframe的name,這樣就可以實現無刷新上傳文件。
<form action="uploadfile.php" enctype="multipart/form-data" method="post" target="iframeUpload">
<iframe name="iframeUpload" src="" width="350" height="35" frameborder=0 SCROLLING="no" style="display:NONE"></iframe>
<input id="test_file" name="test_file" type="file">
<input value="上傳文件" type="submit">
</form>