h5图片展示和ajax上传
<img src="" id="img"/> <script src="http://static.lamian.tv//pc/public/js/jquery-1.8.3.min.js?v=e128811631"></script> <script> $('#file').change(function (e) { console.log(event.target.files); var files = event.target.files, file; if (files && files.length > 0) { file = files[0]; // 来在控制台看看到底这个对象是什么 // console.log(file); // 那么我们可以做一下诸如文件大小校验的动作 if(file.size > 1024 * 1024 * 2) { alert('图片大小不能超过 2MB!'); return false; } // !!!!!! // 下面是关键的关键,通过这个 file 对象生成一个可用的图像 URL // 获取 window 的 URL 工具 var URL = window.URL || window.webkitURL; // 通过 file 生成目标 url var imgURL = URL.createObjectURL(file); // 用这个 URL 产生一个 <img> 将其显示出来 $('#img').attr('src', imgURL); } }) </script>
<script> var formData = new FormData(); var name = $("input").val(); formData.append("file",$("#upload")[0].files[0]); formData.append("name",name); $.ajax({ url : Url, type : 'POST', data : formData, // 告诉jQuery不要去处理发送的数据 processData : false, // 告诉jQuery不要去设置Content-Type请求头 contentType : false, beforeSend:function(){ console.log("正在进行,请稍候"); }, success : function(responseStr) { if(responseStr.status===0){ console.log("成功"+responseStr); }else{ console.log("失败"); } }, error : function(responseStr) { console.log("error"); } }); </script>
暗夜之中,才见繁星;危机之下,暗藏转机;事在人为,为者常成。