當前位置:首頁 » 文件管理 » 上傳圖片後預覽

上傳圖片後預覽

發布時間: 2022-06-09 22:31:47

㈠ 用java上傳圖片時,怎麼實現預覽功能

圖片上傳後在網頁上直接讀取上傳後的地址進行預覽,就是說這個時候圖片已經上傳到伺服器了,如果要寫的嚴謹一些,可以在預覽後進行保存操作,如果不保存,則再寫一條語句把上傳上去的文件刪除

㈡ H5頁面上傳圖片後預覽時載入速度慢是什麼原因啊

影響網頁打開上傳速度的因素主要有如下幾方面:
1、用戶和網站處於不同網段,例如電信用戶與網通網站之間的訪問
2、系統有病毒,尤其是蠕蟲類病毒,嚴重消耗系統資源,打不開頁面,甚至死機。
3、本地網路速度太慢,過多台電腦共享上網,或共享上網用戶中有大量下載時也會出現打開網頁速度慢的問題。
4、使用的瀏覽器有BUG,例如多窗口瀏覽器的某些測試版也會出現打開網頁速度慢的問題。 把本地網路重啟一下,網路修復一下.360把IE修復一下,360衛士/高級/IE修復。
5、訪問的網站負荷太重,帶寬相對太窄,程序設計不合理,也會出現打開網頁速度慢的問題。
6、網路防火牆的設置不允許多線程訪問,例如目前WinXPSP2就對此默認做了限制,使用多線程下載工具就受到了極大限制,BT、迅雷都是如此。因此,同時打開過多頁面也會出現打開網頁速度慢的問題。
7、是否和系統漏洞有關,也不好說,沖擊波等病毒就是通過漏洞傳播並導致系統緩慢甚至癱瘓的
8、網路中間設備問題,線路老化、虛接、路由器故障等。

註: DNS設置方法:
1.網上鄰居 右鍵屬性
2.雙擊 本地連接
3.常規下面選擇 屬性
4.INTERNET 協議(TCP/IP)雙擊
5.使用下面的DNS伺服器地址 (輸入獲取的DNS地址)
6.之後全部確定出來,重啟電腦之後再試一下即可。

㈢ 昵圖網上傳了圖片怎麼生成預覽圖

<p>看我的截圖,首先從「小助手上傳的圖片」進入,點擊「待處理的圖片」,會有你上傳了沒有處理好的圖片,依次點擊每一幅圖的「自動預覽圖」按鈕,接下來就會顯示預覽圖了,光是預覽了還不行,還要提交管理員審核,要填寫圖片信息。</p>
<p></p>

㈣ 昵圖網上上傳圖片 自動預覽以後 還需要手動預覽嗎

自動預覽是系統根據你上傳的圖片 等比例做的小縮略圖做預覽圖 手動預覽 是自己做預覽圖 可以根據自己的喜好、自己需要的效果做預覽圖 二者只能選一個 自動預覽方便省事 手動預覽效果好能讓更多的人認識到你的圖

㈤ extjs怎麼使圖片上傳時顯示預覽

這個我做過,不難,思路給你

1.是當文本框內容發生改變的時候就將圖片上傳到伺服器(如果圖片小,用戶是感覺不到你已經做了上傳操作的。)

2.當伺服器接受到這個圖片的時候,將其放入到一個臨時文件夾中並返回給前台一個圖片路徑(圖片流也可以)。

3.Ajax請求會有一個相應,在伺服器端成功接受到上傳的圖片後,返回給Ajax一個Reponse,這個Reponse里包含一個圖片路徑。

4.ExtJS在前台獲取success里的responseText之後(也就是圖片路徑)將默認圖片的src指向從後台反饋回來的圖片路徑。

現在圖片就會現實出來

流程是:

用戶選擇圖片-->
觸發文本框改變事件--->
在事件中通過AJAX將圖片上傳給伺服器--->
伺服器將圖片名稱修改為UUID以免重復,並將此圖片的路徑返回給前台--->
前台AJAX請求的回調函數中獲取responseText,也就是圖片路徑--->
設置默認圖片的src為responseText---->
用戶重新選擇的時候(例如用戶不喜歡這張圖)--->
在文本框改變事件中通過AJAX將圖片上傳(包括先前上傳的圖片名稱)--->
後台根據參數先刪除臨時圖片--->
重復以上的步驟直到用戶確定

需要注意的問題:
1.當用戶改變了圖片之後,需要把上一次的臨時圖片文件刪除掉,以免出現垃圾圖片過多。

2.每次上傳圖片的時候要在後面跟上一個隨機參數(因為如果請求路徑和參數相同,瀏覽器不會再繼續發送請求)。通常情況下使用new Date()就可以了例如
"uploadImag.do?method=uploadImage&randomParam="+new Date()

3.圖片太大的話,效果不是很好。

4.當用戶點擊確定後,將臨時文件里的圖片放置到你的正式圖片存放目錄下即可。

5.圖片上傳到後台使用UUID改名字,否則可能有重復

㈥ 兩步路裡面上傳照片到百度網盤出現預覽失敗是什麼原因

上傳後圖片預覽失敗,請檢查網路連接是否正常,或伺服器不穩定導致,過一些時間再重試。如果不是這個問題導致,那就是常見的問題,上傳圖片的格式不支持在線預覽導致,需要下載進行轉換,再傳才可以正常瀏覽。如果仍沒解決,是客戶端出了問題,需要重裝解決。

㈦ PHP怎樣上傳圖片以及預覽圖片

本地圖片,就搞個img,設置他的src就可以實現;
參考如下:

<div class="column " style="width: 400px; margin-left: 200px;" id="imageShow">
<div id="proctImageNew">@*用於圖片預覽*@
</div>
<div id="proctImage">
<div class="widget the-common-margin-top" style="height: 400px; border: 1px solid #eeeeee;
padding: 3px;">
<img id="imgHolder" style="max-height: 390px; max-width: 390px;" />
</div>
</div>
</div>
<form id="formImageUpload" name="formImageUpload" method="post" action="/DocTeam/ProctsImage/UploadImage"
enctype="multipart/form-data">
<div id="fileDiv">
<input type="file" id="theFile" name="theFile" size="20" style="cursor: pointer;
width: 65px; height: 60px; position: absolute; filter: alpha(opacity:1); -moz-opacity: 0;
opacity: 0; z-index: 102;" />
</div>
<input type="hidden" name="imageId_hide" id="imageId_hide" />
</form>
<div id="cover" style="position: absolute; background-color: White; z-index: 10;
filter: alpha(opacity=100); -moz-opacity: 1; opacity: 1; overflow: auto; width: 400px;">
<input id="selectImage" type="button" style="width: 65px; height: 60px;" value="Select" />
<br />
<br />
<input type="button" value="Upload" id="imageUpload" style="width: 65px; height: 60px;"
disabled="disabled" onclick="javascript:uploadImage();" />
</div>

//js本地圖片預覽,兼容ie[6-9]、火狐、Chrome17+、Opera11+、Maxthon3
function PreviewImage(fileObj, imgPreviewId, divPreviewId) {
var allowExtention = ".jpg,.bmp,.gif,.png"; //允許上傳文件的後綴名document.getElementById("hfAllowPicSuffix").value;
var extention = fileObj.value.substring(fileObj.value.lastIndexOf(".") + 1).toLowerCase();
var browserVersion = window.navigator.userAgent.toUpperCase();
if (allowExtention.indexOf(extention) > -1) {
if (fileObj.files) {//HTML5實現預覽,兼容chrome、火狐7+等
if (window.FileReader) {
var reader = new FileReader();
reader.onload = function (e) {
document.getElementById(imgPreviewId).setAttribute("src", e.target.result);
}
reader.readAsDataURL(fileObj.files[0]);
} else if (browserVersion.indexOf("SAFARI") > -1) {
alert("不支持Safari6.0以下瀏覽器的圖片預覽!");
}
} else if (browserVersion.indexOf("MSIE") > -1) {
if (browserVersion.indexOf("MSIE 6") > -1) {//ie6
document.getElementById(imgPreviewId).setAttribute("src", fileObj.value);
} else {//ie[7-9]
fileObj.select();
if (browserVersion.indexOf("MSIE 9") > -1)
fileObj.blur(); //不加上document.selection.createRange().text在ie9會拒絕訪問
var newPreview = document.getElementById(divPreviewId + "New");
if (newPreview == null) {
newPreview = document.createElement("div");
newPreview.setAttribute("id", divPreviewId + "New");
}
var a = document.selection.createRange().text;
// newPreview.style.width = document.getElementById(imgPreviewId).width + "px";
// newPreview.style.height = document.getElementById(imgPreviewId).height + "px";
//newPreview.style.width = 390 + "px";
newPreview.style.height = 390 + "px";
newPreview.style.border = "solid 1px #eeeeee";
newPreview.style.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod='scale',src='" + document.selection.createRange().text + "')";
var tempDivPreview = document.getElementById(divPreviewId);
// tempDivPreview.parentNode.insertBefore(newPreview, tempDivPreview);
newPreview.style.display = "block";
tempDivPreview.style.display = "none";

}
} else if (browserVersion.indexOf("FIREFOX") > -1) {//firefox
var firefoxVersion = parseFloat(browserVersion.toLowerCase().match(/firefox\/([\d.]+)/)[1]);
if (firefoxVersion < 7) {//firefox7以下版本
document.getElementById(imgPreviewId).setAttribute("src", fileObj.files[0].getAsDataURL());
} else {//firefox7.0+
document.getElementById(imgPreviewId).setAttribute("src", window.URL.createObjectURL(fileObj.files[0]));
}
} else {
document.getElementById(imgPreviewId).setAttribute("src", fileObj.value);
}
} else {
alert("僅支持" + allowExtention + "為後綴名的文件!");
fileObj.value = ""; //清空選中文件
if (browserVersion.indexOf("MSIE") > -1) {
fileObj.select();
document.selection.clear();
}
fileObj.outerHTML = fileObj.outerHTML;
}
}

function setTheFileButton_Cover_SelectImageButton() {
// debugger;
// var position = $("#selectImage", "#cover").position();
// var css = { top: position.top, left: position.left };
// $("#theFile", "#fileDiv").css(css);
}

var $imgHolder = $('#imgHolder', "#proctImage");
var tempDiv = $("#temp_div");
$("#select", "#cover").click(function () {
$("#theFile", "#fileDiv").click().select();
});
$("#theFile", "#fileDiv").click(function () {
$(this).blur();
});
$("#theFile", "#fileDiv").change(function () {
PreviewImage(this, 'imgHolder', 'proctImage');
setTheFileButton_Cover_SelectImageButton();
// alert("預覽已生成!");
$("#imageUpload").prop("disabled", false);
});

㈧ 當上傳圖片的時候,通過雙擊或者打開圖片就自動可以預覽到

使用FileUpload上傳圖片的時候,通過雙擊或者打開圖片後,自動可以進行預覽,而不需要點擊上傳。

㈨ 用js、jquery如何實現上傳圖片的預覽

$("#btnLoadPhoto").upload({ url: "../UploadForms/RequestUpload.aspx?action=photo", type: "json", callback: calla });
//獲得表單元素
HttpPostedFile oFile = context.Request.Files[0];
//設置上傳路徑
string strUploadPath = "temp/";
//獲取文件名稱
string fileName = context.Request.Files[0].FileName;
補充:JQuery是繼prototype之後又一個優秀的Javascript庫。它是輕量級的js庫 ,它兼容CSS3,還兼容各種瀏覽器(IE 6.0+, FF 1.5+, Safari 2.0+, Opera 9.0+),jQuery2.0及後續版本將不再支持IE6/7/8瀏覽器。jQuery使用戶能更方便地處理HTML(標准通用標記語言下的一個應用)、events、實現動畫效果,並且方便地為網站提供AJAX交互。jQuery還有一個比較大的優勢是,它的文檔說明很全,而且各種應用也說得很詳細,同時還有許多成熟的插件可供選擇。jQuery能夠使用戶的html頁面保持代碼和html內容分離,也就是說,不用再在html裡面插入一堆js來調用命令了,只需要定義id即可。

熱點內容
只編譯一個c文件 發布:2024-09-28 09:54:39 瀏覽:237
指紋密碼怎麼破 發布:2024-09-28 09:45:11 瀏覽:661
自編自選腳本 發布:2024-09-28 09:45:10 瀏覽:931
androidui教程pdf 發布:2024-09-28 09:44:13 瀏覽:899
iphone排列文件夾 發布:2024-09-28 09:30:46 瀏覽:355
安卓用什麼自拍 發布:2024-09-28 09:20:14 瀏覽:384
python聲明列表 發布:2024-09-28 08:54:52 瀏覽:15
全自動密碼指紋鎖哪裡批發 發布:2024-09-28 08:54:51 瀏覽:608
移動服務密碼怎麼查詢 發布:2024-09-28 08:54:47 瀏覽:479
怎麼配置一台主機 發布:2024-09-28 08:42:02 瀏覽:323