ajaxfileupload的使用有关问题
日期：2014-05-16 浏览次数：20308 次
ajaxfileupload的使用问题
在使用ajaxfileupload组件中，能上传图片了，但是碰到了个问题：从本地选择一张图片上传后，在input标签中没有显示该图片的路径，调了很久都没出来。。。
怎么搞，现在项目一定要显示上传图片的本地路径。。。
完整代码：
在使用ajaxfileupload组件中，能上传图片了，但是碰到了个问题：从本地选择一张图片上传后，在input标签中没有显示该图片的路径，调了很久都没出来。。。
怎么搞，现在项目一定要显示上传图片的本地路径。。。
完整代码：
- HTML code
<%@ page contentType="text/html; charset=GBK" %>
<html>
<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="expires" content="0">
<HEAD>
<TITLE> New Document </TITLE>
</HEAD>
<script language="javascript" src="common/jquery/jquery.js"></script>
<script language="javascript" src="common/jquery/ajaxfileupload.js"></script>
<script>
function uploadImage(obj) {
var tmpFilePath = obj.value;
if(validateImage(obj)) {
$.ajaxFileUpload({
url:'http://127.0.0.1:8090/publicInfoUploadImgTopic', //需要链接到服务器地址
secureuri:false,
fileElementId:'newsImgFile', //文件选择框的id属性
dataType: 'json', //服务器返回的格式，可以是json
success: function (data, textStatus) { //相当于java中try语句块的用法
//[{isSuccess:true|false,serverPath:XXXXX}]
alert("上传图片成功！");
//$('#imgPath').val(data[0].serverPath);
//alert($('#imgPath').val());
},
error: function (data, status, e) { //相当于java中catch语句块的用法
$('#imgPath').val('');
}
});
}
}
//校验图片格式及大小 Add Date 2012-6-14 LIUYI
function validateImage(obj) {
var file = obj;
var tmpFileValue = file.value;
//校验图片格式
if(/^.*?\.(gif|png|jpg|jpeg|bmp)$/.test(tmpFileValue.toLowerCase())){
return true;
} else {
alert("只能上传jpg、jpeg、png、bmp或gif格式的图片！");
return false;
}
//校验图片大小,这段代码需调整浏览器安全级别(调到底级)和添加可信站点(将服务器站点添加到可信站点中)
//var imgSize = 1024 * 100; //最大100K
//var img = new Image();
if(file.value != ""){
// img.onreadystatechange = function(){
// if(img.readyState == "complete"){
// if(img.fileSize <=0 || img.fileSize > imgSize){
// alert("当前文件大小" + img.fileSize / 1024 + "KB, 超出最大限制 " + imgSize / 1024 + "KB");
// return false;
// }else{
// alert("OK");
// return true;
// }
// }
// }
// img.src = file.value;
//return true;
}else{
alert("请选择上传的文件!");
return false;
}
}
function test(obj){
alert($(obj).val());
alert(obj.value);
alert(document.getElementById("imgFile").value);
}
</script>
<body>
<table bgcolor="" align="center"><tr><td>
<tr>
<td colspan="2" align="right">
<input type="hidden" id="imgPath" name="imgPath" />
<input type="file" class="abc" style="width:450px;" onchange="uploadImage(this)" id="newsImgFile" name="imgFile" />
</td>
</tr>
</table>
</body>
</html>
免责声明： 本文仅代表作者个人观点，与爱易网无关。其原创性以及文中陈述文字和内容未经本站证实，对本文以及其中全部或者部分内容、文字的真实性、完整性、及时性本站不作任何保证或承诺，请读者仅作参考，并请自行核实相关内容。
