點擊照片上傳照片二
一圖片
二，代碼
<body>
<div class="fft-wrapper">
<form id="submitForm" action="" method="post">
<div class="form-wrapper">
<ul class="upload-wrapper">
<li class="title">上傳門頭照片</li>
<div class="upload-img">
<img id="yushowOuter" class="img" src="${rc.contextPath}/js/css/images/[email protected]" />
<div class="tip fr">
<input onclick="uploadBtnOuter();" value="上傳圖片">
<input type="file" name="uploadOuter" style="display:none;" onchange="previewImgOuter(this);" id="uploadOuter" accept="image/*"/>
</div>
</div>
</ul>
</div>
</form>
</div>
<script>
var lib = {flexible:{rem:150,page:750}};
</script>
<script type="text/javascript" src="js/ajaxfileupload.js"></script>
<script type="text/javascript">
function uploadBtnOuter(){
$("#uploadOuter").click();
}
//圖片預覽 previewImg(this);
function previewImgOuter(imgFile){
var extension = imgFile.value.substring(imgFile.value.lastIndexOf("."),imgFile.value.length);//擴展名
extension = extension.toLowerCase();//把文件擴展名轉換為小寫
if ((extension!=‘.jpg‘)&&(extension!=‘.gif‘)&&(extension!=‘.jpeg‘)&&(extension!=‘.png‘)&&(extension!=‘.bmp‘)){
layer.msg("對不起，系統僅支持標準格式的照片，請您調整格式後重新上傳，謝謝 !");
$(".btn-uploading").focus();//將焦點定位在文件上傳的按鈕上，可以直接按確定鍵再次觸發
}else{
var path;//預覽地址
if(document.all){//IE
imgFile.select();
path = document.selection.createRange().text;
}else{//火狐，谷歌
path = window.URL.createObjectURL(imgFile.files[0]);
}
$("#yushowOuter").attr("src",path);//設置預覽地址
uploadImgOuter(imgFile);
}
}
function uploadImgOuter(imgFile){
var file = imgFile.files[0];//文件對象
var name = file.name;//圖片名
var url = ‘${rc.contextPath}/wxFfanApply.htm?method=UploadFile&state=Outer‘;
$.ajaxFileUpload({
url: url,
secureuri:false,
type: ‘POST‘,
fileElementId:"uploadOuter",
dataType: ‘json‘,
success: function (data, status) //服務器成功響應處理函數
{
var index = data.indexOf(‘{‘);
data= data.substring(index, data.length);
var obj = eval(‘(‘ + data + ‘)‘);
if ("000" == obj.code) {
$("#fssIdOuter").val(obj.fssId);
$("#originalFilenameOuter").val(obj.originalFilename);
$("#imageTypeOuter").val(obj.imageType);
/* alert(obj.fssId);
alert(obj.originalFilename);
alert(obj.imageType); */
alert("上傳成功");
} else {
alert("保存有問題，請重試");
}
},
error: function (data, status, e)//服務器響應失敗處理函數
{
alert(e);
}
});
}
</script>
</body>
</html>
點擊照片上傳照片二