ajaxfileupload.js是一个很方便的上传文件的控件,使用也简单,结合jquery使用
$.ajaxFileUpload({ "url": "${context}/manage/doctor/addDoctor.htm?doctorName=" + doctorName + "&doctorTitle=" + doctorTitle + "&doctorId=" + doctorId, "secureuri": false, "fileElementId": "fileToUpload", "dataType": "json", "success": function (data,status) { if (data.errorCode == 0) { alert("保存成功"); } else {
} }, "error": function (data,status,e) { alert(data.message + " error: " + e); } });
fileElementId 就是你html代码中 <input type="file" id="***">中的ID
需要注意的是,如果你需要的返回数据格式是json,那么后台配置的接口返回的contentType 必须是 text/html ,我用的是spring mvc,所以加了一个bean
<bean id="handlerAdapter" class="org.springframework.web.servlet.mvc.annotation.AnnotationMethodHandlerAdapter"> <property name="messageConverters"> <list> <bean class="org.springframework.http.converter.StringHttpMessageConverter"> <property name="supportedMediaTypes"> <list> <bean class="org.springframework.http.MediaType"> <constructor-arg index="0" value="text" /> <constructor-arg index="1" value="html" /> <constructor-arg index="2" value="UTF-8" /> </bean> </list> </property> </bean> </list> </property> </bean>
再有就是在使用中发现<input type="file">控件,只能使用一次,第二次使用的时候,死活不触发选择按钮会执行的函数,必须刷新页面之后,才能继续使用,后来的解决方案是:
$(document).on('change','#fileToUpload',function () { var objUrl = getObjectURL(this.files[0]); alert(objUrl); if (objUrl) { $("#headPic").attr("src",objUrl); } });
这样就能重复使用该控件进行文件的选择了。这种写法是jquery 1.9之后的写法,jquery旧的版本中使用的是live函数,这个函数后面被舍弃了,用on函数替代。
另外,
$("#fileToUpload").on('change',funtion() {
........
});
以及
$("#fileToUpload").change(funtion() {
........
});
这两种写法,经过测试,也无效。 (编辑:李大同)
【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容!
|