1. 多文件上傳思路
給個例子吧:傳幾個地圖文件到伺服器
1)aspx文件:
<%@ Page language="c#" Codebehind="AddMap.aspx.cs" AutoEventWireup="false" Inherits="ZiFengLast.SystemSet.AddMap" %>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" >
<HTML>
<HEAD>
<title>MapAdmin</title>
<meta content="Microsoft Visual Studio .NET 7.1" name="GENERATOR">
<meta content="C#" name="CODE_LANGUAGE">
<meta content="javaScript" name="vs_defaultClientScript">
<meta content="http://schemas.microsoft.com/intellisense/ie5" name="vs_targetSchema">
<LINK href="../StyleSheet1.css" type="text/css" rel="stylesheet">
<script language="javascript">
function AddFile()
{
var rows=document.getElementById("rows").value;
var cols=document.getElementById("cols").value;
var FileList=document.getElementById("MyFile");
if(document.getElementById("MyFile").innerHTML.toString().length>200)
{
// alert(document.getElementById("MyFile").innerHTML.toString().length);
FileList.innerHTML="<font class='TagTitle'><b>第1個地圖:</b></font> <input style='WIDTH: 200px; HEIGHT: 22px' type='file' size='14' name='File'>";
}
for(i=1;i<cols*rows;i++)
{
j=i+1;
var str ='<font class="TagTitle"><b>第'+j+'個地圖:</b></font> <input style="WIDTH: 200px; HEIGHT: 22px" type="file" size="14" name="File">';
FileList.insertAdjacentHTML("beforeEnd","<br>");
FileList.insertAdjacentHTML("beforeEnd",str);
}
}
</script>
</HEAD>
<body MS_POSITIONING="GridLayout">
<form id="Form1" method="post" encType="multipart/form-data" runat="server">
<FONT face="宋體">
<TABLE id="Table1" style="BORDER-RIGHT: #33cc66 2px groove; BORDER-TOP: #33cc66 2px groove; Z-INDEX: 101; LEFT: 136px; BORDER-LEFT: #33cc66 2px groove; BORDER-BOTTOM: #33cc66 2px groove; POSITION: absolute; TOP: 32px"
width="500" align="center">
<TBODY>
<TR height="20">
<TD width="11%"></TD>
<TD width="11%"></TD>
<TD width="11%"></TD>
<TD width="11%"></TD>
<TD width="11%"></TD>
<TD width="11%"></TD>
<TD width="34%"></TD>
</TR>
<TR>
<TD colSpan="2"></TD>
<TD colSpan="4"><FONT class="WelcomeText" face="幼圓" color="#ff00ff" size="4">添加新地圖</FONT></TD>
</TR>
<tr>
<td class="TagTitle" align="right" colSpan="3"><b>請選擇地圖規格:</b></td>
<td class="TagTitle" colSpan="2"><input id="rows" style="WIDTH: 32px; HEIGHT: 22px" type="text" size="1" value="1" runat="server"
NAME="rows">行<input id="cols" style="WIDTH: 32px; HEIGHT: 22px" type="text" size="1" value="1" runat="server"
NAME="cols">列</td>
<td colSpan="2"><input style="WIDTH: 72px; HEIGHT: 22px" onclick="AddFile()" type="button" value="確定"></td>
</tr>
<TR>
<TD class="TagTitle" align="right" width="33%" colSpan="3"><B>請選擇地圖文件:</B>
</TD>
<TD class="TagTitle" width="33%" colSpan="4"></TD>
</TR>
<tr>
<td colSpan="7">
<p id="MyFile"><font class="TagTitle"><b>第1個地圖:</b></font>
<input style="WIDTH: 200px; HEIGHT: 22px" type="file" size="14" name="File">
</p>
</td>
<TR>
<TD class="TagTitle" align="right" width="33%" colSpan="3"><B>請輸入地圖存儲名稱:</B>
</TD>
<TD class="TagTitle" align="left" width="33%" colSpan="4"><INPUT id="MapName" style="WIDTH: 128px; HEIGHT: 22px" type="text" size="16" name="Password"
runat="server">
<asp:requiredfieldvalidator id="RequiredFieldValidator2" runat="server" CssClass="TagTitle" ErrorMessage="地圖名不能為空"
Font-Names="微軟雅黑" Font-Size="X-Small" ControlToValidate="MapName"></asp:requiredfieldvalidator></TD>
</TR>
<TR>
<TD class="TagTitle" style="HEIGHT: 29px" align="right" width="33%" colSpan="3"><B><asp:label id="Msg0" runat="server"></asp:label></B>
</TD>
<TD class="TagTitle" style="HEIGHT: 29px" width="33%" colSpan="4"><span class="ErrorMessage" id="OutputSpan" runat="server"><asp:label id="Msg" runat="server"></asp:label></span></TD>
</TR>
<TR>
<TD width="11%"></TD>
<TD width="11%"></TD>
<TD width="22%" colSpan="4">
<asp:button id="SubmitButton" runat="server" Font-Names="微軟雅黑" Font-Size="X-Small" Text="提交"
Height="26px" Width="60px"></asp:button><INPUT id="CancelButton" style="FONT-SIZE: x-small; WIDTH: 60px; FONT-FAMILY: 微軟雅黑; HEIGHT: 26px"
type="reset" value="清除" name="CancelButton"></TD>
<TD width="34%">
</TD>
</TR>
</TBODY>
</TABLE>
<TABLE id="Table2" style="Z-INDEX: 102; LEFT: 136px; WIDTH: 491px; POSITION: absolute; TOP: 8px; HEIGHT: 26px"
width="491" align="center">
<TR>
<TD class="TagTitle"><A href="DeleteMap.aspx"><FONT class="WelcomeText" face="幼圓">刪除已有地圖</FONT></A></TD>
</TR>
</TABLE>
</FONT>
</form>
</TR></TBODY></TABLE></FONT>
</body>
</HTML>
2)後台cs文件:關鍵是使用Request.Files獲取剛上傳的文件:
using System;
using System.Collections;
using System.ComponentModel;
using System.Data;
using System.Drawing;
using System.Web;
using System.Web.SessionState;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.HtmlControls;
using System.Configuration;
namespace ZiFengLast.SystemSet
{
/// <summary>
/// MapAdmin 的摘要說明。
/// </summary>
public class AddMap : System.Web.UI.Page
{
protected System.Web.UI.WebControls.Button SubmitButton;
protected System.Web.UI.WebControls.RequiredFieldValidator RequiredFieldValidator2;
protected System.Web.UI.HtmlControls.HtmlGenericControl OutputSpan;
protected System.Web.UI.WebControls.Label Msg;
protected System.Web.UI.WebControls.Label Msg0;
protected System.Data.SqlClient.SqlConnection MapConn;
protected System.Data.SqlClient.SqlCommand MapComm;
protected System.Web.UI.HtmlControls.HtmlInputText rows;
protected System.Web.UI.HtmlControls.HtmlInputText cols;
protected System.Web.UI.HtmlControls.HtmlInputText MapName;
private void Page_Load(object sender, System.EventArgs e)
{
// 在此處放置用戶代碼以初始化頁面
}
#region Web 窗體設計器生成的代碼
override protected void OnInit(EventArgs e)
{
//
// CODEGEN: 該調用是 ASP.NET Web 窗體設計器所必需的。
//
InitializeComponent();
base.OnInit(e);
}
/// <summary>
/// 設計器支持所需的方法 - 不要使用代碼編輯器修改
/// 此方法的內容。
/// </summary>
private void InitializeComponent()
{
this.MapConn = new System.Data.SqlClient.SqlConnection();
this.MapComm = new System.Data.SqlClient.SqlCommand();
this.SubmitButton.Click += new System.EventHandler(this.SubmitButton_Click);
//
// MapConn
//
this.MapConn.ConnectionString =System.Configuration.ConfigurationSettings.AppSettings["sqlMap"];
//
// MapComm
//
this.MapComm.Connection = this.MapConn;
this.Load += new System.EventHandler(this.Page_Load);
}
#endregion
private void SubmitButton_Click(object sender, System.EventArgs e)
{
try
{
HttpFileCollection file=Request.Files;
System.Text.StringBuilder FileNameArray=new System.Text.StringBuilder();
string SaveName=this.MapName.Value.Trim();
string FileExtension0=System.IO.Path.GetExtension(System.IO.Path.GetFileName(file[0].FileName));
for(int i=0;i<file.Count;i++)
{
HttpPostedFile PostFile=file[i];
string FileName=System.IO.Path.GetFileName(PostFile.FileName);
FileName.Replace(";","_");
string FileExtension=System.IO.Path.GetExtension(FileName);
string ContentType=PostFile.ContentType.ToString();
string LastSaveName=SaveName+(i+1).ToString()+FileExtension;
PostFile.SaveAs(Request.MapPath("../Map/"+LastSaveName));
FileNameArray.Append(LastSaveName);
FileNameArray.Append(";");
}
this.MapComm.CommandText="Select [Map].* from [Map] where MapName='"+SaveName+"'";
this.MapConn.Open();
System.Data.SqlClient.SqlDataReader rd=this.MapComm.ExecuteReader();
if(rd.Read())
{
this.MapConn.Close();
this.MapConn.Dispose();
this.MapComm.Dispose();
rd.Close();
Msg0.Text="<font class=ErrorMessage>上傳文件失敗!</font>";
Msg.Text="<font class=ErrorMessage>已有該地圖名稱,請指定另外的名稱</font>";
}
else
{
rd.Close();
this.MapComm.CommandText="insert into [Map](MapName,MapRows,MapCols,MapFileNames) Values('"+SaveName+"',"+int.Parse(rows.Value)+","+int.Parse(cols.Value)+",'"+FileNameArray+"')";
//Response.Write(MapComm.CommandText);
this.MapComm.ExecuteNonQuery();
this.MapConn.Close();
this.MapConn.Dispose();
this.MapComm.Dispose();
}
Msg0.Text="<font class=ErrorMessage>上傳文件成功!</font>";
Msg.Text="<font class=ErrorMessage>共計上傳文件"+file.Count.ToString()+"個"+"<br>"+FileNameArray+"</font>";
}
catch(Exception ee)
{
Msg0.Text="<font class=ErrorMessage>上傳文件失敗!</font>";
Msg.Text="<font class=ErrorMessage>"+ee.ToString()+"</font>";
}
}
}
}
2. 怎麼通過HTML+PHP上傳文件到伺服器
HTML代碼:
<body>
<form action="" method="post" enctype="multipart/form-data" name="upload_form">
<label>選擇圖片文件</label>
<input name="imgfile" type="file" accept="image/gif, image/jpeg"/>
<input name="upload" type="submit" value="上傳" />
</form>
</body>
PHP代碼:
if (isset($_FILES['imgfile'])
&& is_uploaded_file($_FILES['imgfile']['tmp_name']))
{
$imgFile = $_FILES['imgfile'];
$upErr = $imgFile['error'];
if ($upErr == 0)
{
$imgType = $imgFile['type']; //文件類型。
/* 判斷文件類型,這個例子里僅支持jpg和gif類型的圖片文件。*/
if ($imgType == 'image/jpeg'
|| $imgType == 'image/gif')
{
$imgFileName = $imgFile['name'];
$imgSize = $imgFile['size'];
$imgTmpFile = $imgFile['tmp_name'];
/*
將文件從臨時文件夾移到上傳文件夾中。
注意:upfile這個文件夾必須先創建好,不然會報錯。
*/
move_uploaded_file($imgTmpFile, 'upfile/'.$imgFileName);
/*顯示上傳後的文件的信息。*/
$strPrompt = sprintf("文件%s上傳成功<br>"
. "文件大小: %s位元組<br>"
. "<img src='upfile/%s'>"
, $imgFileName, $imgSize, $imgFileName
);
echo $strPrompt;
}
else
{
echo "請選擇jpg或gif文件,不支持其它類型的文件。";
}
}
else
{
echo "文件上傳失敗。<br>";
switch ($upErr)
{
case 1:
echo "超過了php.ini中設置的上傳文件大小。";
break;
case 2:
echo "超過了MAX_FILE_SIZE選項指定的文件大小。";
break;
case 3:
echo "文件只有部分被上傳。";
break;
case 4:
echo "文件未被上傳。";
break;
case 5:
echo "上傳文件大小為0";
break;
}
}
}
else
{
}
3. 誰有springmvc multipartfile html5 多文件上傳的示例代碼,急!急!急!
<formid="fileUpload"action="<%=basePath%>template/fileUpload.do"enctype="multipart/form-data"method="post"class="form-horizontal">
<divclass="modal-header">
<buttontype="button"class="close"data-dismiss="modal"
aria-hidden="true">×</button>
<h4class="modal-title"id="myModalLabel"style="color:#15428b;">上傳</h4>
</div>
<divclass="modal-body">
<inputtype="file"name="targetFile">
<inputtype="file"name="targetFile">
<inputtype="file"name="targetFile">
</div>
<divclass="modal-footer">
<buttonid="cancel"type="button"class="btnbtn-default"data-dismiss="modal">取消
</button>
<buttontype="button"class="btnbtn-primary"onclick="uploadFile();">確認</button>
</div>
</form>
@RequestMapping(value="/fileUpload.do")
publicStringfileUpload(Modelmodel,@RequestParamMultipartFile[]targetFile,HttpServletRequestrequest,PageSplit<BankVo>pageSplit){
try{
FileOperationsUtil.uploadFileMVC(request,targetFile,"/files/temporary");
model.addAttribute("msg","文件上傳成功!");
}catch(Exceptione){
logger.error(e);
model.addAttribute("msg","文件上傳失敗!");
}
returnthis.allButton(model,request,pageSplit);
}
publicstaticvoiploadFileMVC(HttpServletRequestrequest,MultipartFile[]fileSource,StringfileTarget){
for(MultipartFilefile:fileSource){
if(file.isEmpty()){
System.out.println("文件未上傳");
}else{
//如果用的是Tomcat伺服器,則文件會上傳到\%TOMCAT_HOME%\webapps\項目\fileTarget\文件夾中
StringrealPath=request.getSession().getServletContext().getRealPath(fileTarget);
//這里不必處理IO流關閉的問題,因為FileUtils.InputStreamToFile()方法內部會自動把用到的IO流關掉,我是看它的源碼才知道的
try{
FileUtils.InputStreamToFile(file.getInputStream(),newFile(realPath,file.getOriginalFilename()));
}catch(IOExceptione){
//TODOAuto-generatedcatchblock
e.printStackTrace();
}
}
}
}
4. 在html頁面裡面製作一個上傳圖片的區域,就是點那個區域,就能上傳照片,這個html代碼應該怎麼寫
你好,html上傳文件的代碼如下:
<inputtype="file"name="fileUpload"/>
<inputtype="submit"value="上傳文件"/>
至於你要說的有個區域顯示圖片的,這個需要配合前端開發才可以,單純的html代碼是做不到的,謝謝。
5. 如何用HTML上傳文件,以及用HTML發送信息到自己的伺服器
上傳文件用input標簽:
<form enctype="multipart/form-data">
<input type="file" />
</form>
後半句沒明白啥意思
6. 求助,html頁面里,寫多文件上傳,在controller進行後台處理文件數據
」及時響應數據「這句話沒理解錯的話應該就是非同步更新的意思吧!
用MVC3有兩個個好東西你一定要知道的:一個是AJAX.BegionForm,還有一個AJAX.ActionLink這兩個是MVC3中提供的非同步刷新處理數據的兩個小玩意,可以學習下;
根據樓主的需求,當用戶輸入的時候就需要響應數據,那以上的兩個方法都不行;因為樓主的需求是需要觸發JS事件的,所以可以考慮用JS實現的非同步提交,或者JQ;
下面JS代碼:
<script type="text/javascript">
var xmlhttp;
function loadXMLDoc(url, cfunc) {
//根據瀏覽器的不同選擇初始化
if (window.XMLHttpRequest) { // Mozilla, Safari,...
xmlhttp = new XMLHttpRequest();
if (xmlhttp.overrideMimeType) {
xmlhttp.overrideMimeType('text/xml');
}
}
else if (window.ActiveXObject) { // 判斷各種瀏覽器
try {
xmlhttp = new ActiveXObject("Msxml2.XMLHTTP");
} catch (e) {
try {
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
}
catch (e) {
try {
xmlhttp = new ActiveXObject("Msxml2.XMLHTTP.4.0");
} catch (e) {
alert("頁面載入錯誤!");
return;
}
}
}
}
else {
alert("頁面載入錯誤!");
return;
}
//End
xmlhttp.onreadystatechange = cfunc;
xmlhttp.open("GET", url, true);
xmlhttp.send();
}
// 使用 Callback 函數
function myFunction(id) {
loadXMLDoc("./AJAX/TimeTxt.cshtml?ID="+id, function () { //此地址為Action的地址,就是C層控制器的URl,這里需要根據你的需求來改,ID實際上就是傳入的數據,ID在C層獲取就行業務邏輯操作。
if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
document.getElementById("myDiv").innerHTML = xmlhttp.responseText;//此為響應返回的數據把他放在一個ID為myDiv的div裡面,比如return 「hello」; div裡面則顯示hello.
}
});
}
</script>
<input type="text" onblur="myFunction(this.value)" name="id" value="" /> //這句話的意思就是當用戶輸入完成時離開text的時候執行JS事件
<div id="myDiv"></div>
基本上就是這樣了,不知道符合你的需求不!
7. 請教HTML5中多文件上傳時如控制可選擇文件的個數
<!DOCTYPEHTML>
<html>
<metahttp-equiv="Content-Type"content="text/html;charset=UTF-8">
<body>
<scripttype="text/javascript">
functiononc(){
varfiles=document.getElementById("input").files;
for(vari=0;i<files.length;i++){
alert(input.files[i].name);
}
}
</script>
<inputtype="file"id="input"name="input"multiple="multiple"/>
<buttononclick="onc()">查看文件</button>
</form>
<p>請嘗試在瀏覽文件時選取一個以上的文件。</p>
</body>
</html>
8. 用html5進行多文件上傳的時候是一次性把所有已選擇文件傳到後台么
html傳多個文件對前端來說是一股腦的提交,但是其實主要還是看後台是如版何接收的。後台可權以設置一次性接收的文件數據,文件大小等等。其實就和平時的上傳下載是一樣的。
以下載為例:下載的時候,比如用迅雷下載,你的本機是否可以選擇並行下載、逐個下載還可以停止、繼續下載。同樣的,上傳也是一個類似的過程,主要依靠伺服器代碼進行管理設置。本質上,是兩個計算機之間相互傳遞數據流而已。
當然,在默認的時候,伺服器是接收多個文件的,比如javaweb中struts2接收文件默認是接收完所有文件然後再操作的。
9. html上傳文件代碼
html前端代碼:
<html>
<body>
<formaction="upload-file.php"method="post"
enctype="multipart/form-data">
<labelfor="file">文件名:</label>
<inputtype="file"name="file"id="file"/>
<br/>
<inputtype="submit"name="submit"value="提交"/>
</form>
</body>
</html>
如果是ubuntu上部署apache2,你應該是php開發者吧,action="upload-file.php
" 中的upload-file.php改為你自己的後端php接收文件的邏輯代碼即可!
這里提供upload-file.php後端接收文件的代碼:
<?php
if($_FILES["file"]["error"]>0)
{
echo"錯誤:".$_FILES["file"]["error"]."<br/>";
}
else
{
echo"文件名:".$_FILES["file"]["name"]."<br/>";
echo"類型:".$_FILES["file"]["type"]."<br/>";
echo"大小:".($_FILES["file"]["size"]/1024)."Kb<br/>";
}
if(file_exists("upload/".$_FILES["file"]["name"]))
{
echo$_FILES["file"]["name"]."文件已經存在.";
}
else
{
move_uploaded_file($_FILES["file"]["tmp_name"],
"upload/".$_FILES["file"]["name"]);
echo"文件已經被存儲到:"."upload/".$_FILES["file"]["name"];
}
?>
代碼很簡單,我相信你應該能看懂,這里的 文件夾 upload/ 需要你自己手動創建,請確保文件路徑正取!
我也是web開發者,有問題可繼續追問我!或是加我工作室QQ(540144097),在群里向我提問!有問必答,望採納......