js上传图片，预览

我刚开通博客，我也不会像那些人写的那么麻烦，我就挑干的做，功能的实现

1.首先需要把这个div放到页面上，样式就找前端挑一下就ok　

<label for="requirement" class="col-md-3 control-label span3">图片上传</label>
<div class="col-md-9">
<div class="input-group">
　　<input id="photoCover" class="form-control" readonly type="text">
　　<label class="input-group-btn">
　　　　<input id="file" type="file" name="file" style="left: -9999px; position: absolute;">
　　　　<span class="btn btn-default">Browse</span>
　　</label>
</div>
</div>

2.其次就是给这个id=“file” 注册单击事件，就是所谓的选择图片，浏览图片

$("#file").change(function (e) {
　　var file = e.target.files[0] || e.dataTransfer.files[0];
　　$('#photoCover').val(document.getElementById("file").files[0].name);
　　if (file) {
　　　　var reader = new FileReader();
　　　　reader.onload = function () {
　　　　　　$("img").attr("src", this.result);
　　　　}

　　　　reader.readAsDataURL(file);
　　}
});

3.就是保存图片的请求，当然有一些参数需要一起的，就在formdata后面拼接就行

function save(){
　　var id = $("#id").val().trim();
　　var file = document.getElementById("file").files[0];
　　var formData = new FormData();
　　formData.append('id', id);
　　formData.append('file', file);

　　$.ajax({
　　　　url: "/home/about",
　　　　type: "post",
　　　　data: formData,
　　　　contentType: false,
　　　　processData: false,
　　　　mimeType: "multipart/form-data",
　　　　success: function (data) {
　　　　
　　　　},
　　　　error: function (data) {
　　　　
　　　　}
　　});
}

大家觉得可以的话 ，我会经常把我遇到的比较好的 ，写在这里给大家，谢谢