可以用webuploader插件，上傳成功後，服務端返回圖片地址，客戶端<img>顯示圖片
X關閉按鈕這個得自己用css樣式控制，點擊X後，服務端刪除圖片，然後前端移除該X掉的圖片
『貳』 前端，圖片上傳點擊 input type=file 選擇好了想要上傳的圖片，點擊打開，
你是要傳到伺服器的話那就是後台實現。
如果不傳到伺服器在頁面上不能直接顯示出來，系統有限制。 但是在大部分的手機瀏覽器裡面是可以直接讀取。
例如下面這段直接載入本地選擇的圖片地址，會報錯：Not allowed to load local resource
意思是不允許讀取本地資源。
varfileupload=document.getElementById('upload');
fileupload.onchange=function(event){
varimg=document.createElement('img');
img.src=this.value;
document.body.appendChild(img);
};
『叄』 web前端上傳圖片的幾種方法
下面給你介紹3種web前端上傳圖片的方法：
1.表單上傳
最傳統的圖片上傳方式是form表單上傳，使用form表單的input[type=」file」]控制項，打開系統的文件選擇對話框，從而達到選擇文件並上傳的目的。
ajax無刷新上傳
Ajax無刷新上傳的方式，本質上與表單上傳無異，只是把表單里的內容提出來採用ajax提交，並且由前端決定請求結果回傳後的展示結果。
3.各類插件上傳
當上傳的需求要求可預覽、顯示上傳進度、中斷上傳過程、大文件分片上傳等等，這時傳統的表單上傳很難實現這些功能，我們可以藉助現有插件完成。
如網路上傳插件Web Uploader、jQuery圖片預覽插件imgPreview 、拖拽上傳與圖像預覽插件Dropzone.js等等，大家可根據項目實際需求選擇適合的插件。
『肆』 前端怎麼傳圖片給後台（java）
你可以現在前台控制台列印一下base64的流，看看是否獲取圖片成功。如果成功再去後台看看獲取的文件信息，haerd中是否有數據。
然後就是你沒有後台代碼，這里也不好判斷是否是接收問題
『伍』 網站是用WordPress搭建的，在前段編輯頁面上傳圖片完成後，前端頁面代碼沒有顯示alt，這是什麼原因
你的站首頁、文章頁、普通頁面，裡面所有圖片，你用chrome上瀏覽你的網站，右擊圖片審視元素，看裡面的圖片代碼 一般正確的格式是這樣的
<img src="圖片鏈接地址" alt="圖片名字">
alt這里就是要給圖片起個名氣，好讓搜索引擎爬你的網站的時候知道這個圖片叫神馬，seo優化是必須要做好這一步的
上面那個朋友的方法，就是添加你的文章圖片時的填上alt信息，但一般有些主題的自帶圖片是不會有alt信息，得你自己去編輯主題添加
『陸』 前端實現多圖片上傳獲取到一個數組怎麼在後台接受這個數組
// 這是一個嵌入到網頁中動態顯示50是張圖片的java小應用程序，希望你對有幫助！
import java.awt.*;
import java.applet.*;
public class Picture extends Applet
{
Image[] theImages;
int nNum = 50;
int nNow = 0;
public void init()
{
theImages = new Image[nNum];
for(int i = 0; i < nNum ; i++)//將圖片裝入數組
theImages[i] = getImage(getDocumentBase(), "pic" + Integer.toString(i) + ".jpg");
}
public void start()
{
nNow = 0;
}
public void paint(Graphics g)
{
g.drawImage(theImages[nNow],500,500,this);
nNow++;
if(nNow>=nNum)
nNow = 0;
try
{
Thread.sleep(50);
}
catch(Exception e){showStatus(e.toString());}
repaint();
}
public void main()
{
Graphics g;
g=this.getGraphics ();
init();
start();
paint(g);
}
}
『柒』 前端批量上傳圖片後端怎麼接收
循環啊 非同步啊，直接轉換成base64傳到後台，後台循環解碼，保存在文件夾裡面不就可以了。
『捌』 前端使用form表單提交圖片後，java後台怎麼獲取該圖片
首先在html的form添加:enctype="multipart/form-data"
//Java代碼
@RequestMapping("/upload")
publicStringaddUser(@RequestParam("file")CommonsMultipartFile[]files,HttpServletRequestrequest){
for(inti=0;i<files.length;i++){
System.out.println("fileName---------->"+files[i].getOriginalFilename());
if(!files[i].isEmpty()){
intpre=(int)System.currentTimeMillis();
try{
//拿到輸出流，同時重命名上傳的文件
FileOutputStreamos=newFileOutputStream("H:/"+newDate().getTime()+files[i].getOriginalFilename());
//拿到上傳文件的輸入流
FileInputStreamin=(FileInputStream)files[i].getInputStream();
//以寫位元組的方式寫文件
intb=0;
while((b=in.read())!=-1){
os.write(b);
}
os.flush();
os.close();
in.close();
intfinaltime=(int)System.currentTimeMillis();
System.out.println(finaltime-pre);
}catch(Exceptione){
e.printStackTrace();
System.out.println("上傳出錯");
}
}
}
return"/success";
}
『玖』 求C#上傳圖片案例
這個要js 控制圖片變化，上傳可以新建一個類，上傳方法參考
#region 上傳文件
/// <summary>
/// 開始上傳文件
/// </summary>
public string UpLoadStart(out bool success, out string savePathOut)
{
//標記是否成功
bool flag = false;
//返回的值
success = false;
savePathOut = "";
string returnvalue = "";
if (PostedFile != null)
{
string save_Path = "";
string saveName = "";
try
{
//獲取文件路徑
string fileName = PathToName(PostedFile.FileName);
if (filename == "")
{
returnvalue = "請選擇文件,系統不允許進行下一步操作!";
}
else
{
fileName = filename;
string _fileName = "";
//判斷是否限制後綴(擴展名)
if (IsLimit())
{
if (isGetExtension)
{
//從配置文件取出 擴展名集合
Extension = GetFileExtendsFromConfig();
}
//擴展名
string[] Exten = Extension.Split(',');
if (Exten.Length == 0)
{
returnvalue = "你未設置上傳文件類型,系統不允許進行下一步操作!";
}
else
{
//遍歷 後綴
for (int i = 0; i < Exten.Length; i++)
{
//判斷文件名（含擴展名）末尾是否與 允許上傳的擴展名集合相符
if (fileName.ToLower().EndsWith(Exten[i].ToLower()))
{
int fileLength = PostedFile.ContentLength;
if (fileLength > FileLength)
{
returnvalue = "上傳文件限制大小:" + FileLength / 1024 + "kb！";
}
else
{
save_Path = System.Web.HttpContext.Current.Server.MapPath("~\\" + SavePath + "\\");
savePathOut = save_Path;
saveName = save_Path + fileName;
//如果沒有 就創建目錄
if (!Directory.Exists(save_Path)) { Directory.CreateDirectory(save_Path); }
//保存文件
PostedFile.SaveAs(saveName);
_fileName = fileName;
flag = true;
success = true;
returnvalue = saveName + ",大小為" + Common.NumberPlus.RemoveDecimalPoint(fileLength.ToString("N")) + "位元組," + Convert.ToString(Math.Round((Convert.ToDecimal(fileLength) / 1024 / 1024), 2)) + "M";
//decimal類型具有更高的精度和更小的范圍，這使它適合於財務和貨幣計算
}
}
}
if (flag == false)
returnvalue = "只允許上傳" + Extension + " 文件!";
}
}
else
{
//不限制後綴的情況
if (PostedFile.ContentLength > FileLength)
{
returnvalue = "上傳文件限制大小:" + FileLength / 1024 + "kb！";
}
else
{
save_Path = System.Web.HttpContext.Current.Server.MapPath("~\\" + SavePath + "\\");
savePathOut = save_Path;
saveName = save_Path + fileName;
//如果沒有 就創建目錄
if (!Directory.Exists(save_Path)) { Directory.CreateDirectory(save_Path); }
PostedFile.SaveAs(saveName);
_fileName = fileName;
success = true;
returnvalue = saveName + ",大小為" + Common.NumberPlus.RemoveDecimalPoint(fileLength.ToString("N")) + "位元組," + Convert.ToString(Math.Round((Convert.ToDecimal(fileLength) / 1024 / 1024), 2)) + "M";
}
}
}
}
catch (System.Exception exc)
{
returnvalue = exc.Message + "(" + saveName + ")";
}
}
else
{
returnvalue = "上文件失敗!";
}
return returnvalue;
}
#endregion
『拾』 前端上傳文件的幾種方法
1.表單上傳
最傳統的圖片上傳方式是form表單上傳，使用form表單的input[type=」file」]控制項，打開系統的文件選擇對話框，從而達到選擇文件並上傳的目的。
form表單上傳
表單上傳需要注意以下幾點：
(1).提供form表單，method必須是post。
(2).form表單的enctype必須是multipart/form-data。
javascript學習交流群：453833554
enctype 屬性規定在發送到伺服器之前應該如何對表單數據進行編碼。默認地，表單數據會編碼為 "application/x-www-form-urlencoded"。就是說，在發送到伺服器之前，所有字元都會進行編碼。HTML表單如何打包數據文件是由enctype這個屬性決定的。enctype有以下幾種取值：
application/x-www-form-urlencoded：在發送前編碼所有字元(默認)(空格被編碼為』+』，特殊字元被編碼為ASCII十六進制字元)。
multipart/form-data：不對字元編碼。在使用包含文件上傳控制項的表單時，必須使用該值。
text/plain：空格轉換為 「+」 加號，但不對特殊字元編碼。
默認enctype=application/x-www-form-urlencoded，所以表單的內容會按URL規則編碼，然後根據表單的提交方法：
method=』get』 編碼後的表單內容附加在請求連接後，
method=』post』 編碼後的表單內容作為post請求的正文內容。