在做公司业务的时候,需要上传图片,之前还真没使用过,现在在这里先留下方法。
其实很简单,先看前端,就是使用的input=“file"这个属性。
function save() {
$("#mainform").submit();
}
View Code
后台就使用Request.Files接收就行了。
var file = Request.Files["file"];//图片
但是发现这种方式有个缺陷,form提交后没有回调函数。于是在百度后发现有人使用js.form可以回调,试了一下发现可行。
需要下载jquery.form.min.js
//上传
function submitBtn() {
if ($("#file").val() == "") {
alert("请先选择图片")
return;
}
//回调
$("#mainform").ajaxSubmit({
type: "post",
cache:false,
success: function (text) {
$("#ds").val(text);
$("#file").val("");
$("#pic").remove();
}
});
}
function selectFile() {
$("#file").trigger("click");
}
//在div中让图片显示出来
function getFilePath() {
if (typeof FileReader == "undefined") {
alert("您的浏览器不支持FileReader对象!");
}
$("#img").empty();
var oFReader = new FileReader();
var file = document.getElementById('file').files[0];
console.log(file)
oFReader.readAsDataURL(file);
oFReader.onloadend = function (oFRevent) {
var src = oFRevent.target.result;
$("#img").append("");
}
}
img {
width: auto;
height: auto;
max-width: 100%;
max-height: 100%;
}
View Code
后台依然是使用Request.Files接收。然后使用
file.SaveAs (FullPath);//上传
进行保存,FullPath为需要保存的路径。