//建立一個可存取到該file的url
function getObjectURL(file) {
var url = null;
if (window.createObjectURL != undefined) { // basic
url = window.createObjectURL(file);
} else if (window.URL != undefined) { // mozilla(firefox)
url = window.URL.createObjectURL(file);
} else if (window.webkitURL != undefined) { // webkit or chrome
url = window.webkitURL.createObjectURL(file);
}
return url;
}
$(document).on('change', '.wishfile', function () {
var _upload_file = $(this).val().toLowerCase();
var _upload_file_hz = _upload_file.substr(_upload_file.lastIndexOf('.') + 1);
var _upload_file = ['jpg', 'png', 'gif', 'jpeg'];
if ($.inArray(_upload_file_hz, _upload_file) < 0) {
alert('上传格式不正确');
$(this).val('');
return false;
}
var objUrl = getObjectURL(this.files[0]);
//console.log("objUrl = " + objUrl);
if (objUrl) {
// img src=objUrl
}
});
        // form要写enctype="multipart/form-data"
var formData = new FormData($("#formid")[0]);
$.ajax({
url: 'dopost.php',
type: 'POST',
data: formData,
//async: false,
cache: false,
contentType: false,
processData: false,
success: function (returndata) {
if (returndata == 1) {
alert('上传成功');
} else {
alert('上传失败');
}
},
error: function (returndata) {
alert('something wrong!');
}
});

h5 js 图片预览并判断 ajax上传的更多相关文章

  1. H5图片预览、压缩、上传

    目标实现: 1.选择图片, 前端预览效果 2.图片大于1.2M的时候, 对图片进行压缩 3.以表单的形式上传图片 4.图片删除 预览效果图: 代码说明: 1.input:file选择图片 <!- ...

  2. js实现图片预览、压缩、上传

    先看几个对象:Blob.ArrayBuffer.File.fileReader.formData 详细解释请参考:https://www.cnblogs.com/youhong/p/10875190. ...

  3. h5的图片预览

    h5的图片预览是个好东西,不需要保存到后台就能预览图片 代码也很短 <!DOCTYPE html> <html> <head> <meta charset=& ...

  4. ASP.NET工作笔记之一:图片上传预览及无刷新上传

    转自:http://www.cnblogs.com/sibiyellow/archive/2012/04/27/jqueryformjs.html 最近项目里面涉及到无刷新上传图片的功能,其实也就是上 ...

  5. thinkphp3.2.2有预览的多图上传

    thinkphp3.2.2有预览的多图上传 整体思路 1 封装文件上传和图片上传的类文件 2 视图中添加相关JS和表单提交 3 控制器中添加上传文件的相关代码 一 2个class 文件 请上传到/Th ...

  6. js图片预览插件,不涉及上传

    小小的几十行代码,很牛逼,很实用. 支持多个图片的预览,只要new多个对象就行了. html如下 <!-- zhouxiang www.zhou-xiang.com --> <!DO ...

  7. previewImage.js图片预览缩放保存插件

    previewImage.js好用的图片预览缩放保存插件

  8. vue.js 图片预览

    Vue.js的图片预览的插件还是不少,但是找了半天还是没找到跟现在项目里能用得很顺手的,其实项目里图片预览功能很简单,点击放大,能双指缩放就可以了.部分vue.js的图片预览库都需要把图片资源单独拿出 ...

  9. js图片预览带进度条

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

随机推荐

  1. 查找SQL SERVER被锁的表和解决方法

    查找数据库中被锁表代码: select   request_session_id   spid,OBJECT_NAME(resource_associated_entity_id) tableName ...

  2. 向架构师进军--->如何编写软件架构文档

    如果你对项目管理.系统架构有兴趣,请加微信订阅号"softjg",加入这个PM.架构师的大家庭 问:为什么要编写软件架构文档,它的好处是什么? 答: 有文档的架构有助于不同利益相关 ...

  3. 修复HTTP 503错误

    要解决此问题,按照下列步骤操作: 1.验证是否已为虚拟服务器配置了应用程序池.默认的应用程序池是MSSharePointPortalAppPool. 请按照下列步骤来确定虚拟服务器正在使用的应用程序池 ...

  4. pip UnicodeDecodeError: 'ascii' codec can't decode byte

    http://blog.csdn.net/computerms/article/details/48056103

  5. WM_GETMINMAXINFO消息 中结构体MINMAXINFO

    MINMAXINFO* lpMMI lpMMI->ptMaxSize.x = 800;  // 设置窗口最大化时的宽度 lpMMI->ptMaxSize.y = 600;  // 设置窗口 ...

  6. iOS CoreAnimate 动画实现

    这里主要讲的是使用CoreAnimate实现所需的动画. 先上官网的介绍:https://developer.apple.com/library/ios/documentation/Cocoa/Con ...

  7. 三维场景中使用BillBoard技术

    三维场景中对于渲染效果不是很精致的物体可以使用BillBoard技术实现,使用该技术需要将物体实时朝向摄像机,即计算billboard的旋转矩阵M. 首先根据摄像机位置cameraPos和billBo ...

  8. MySql开始日期、结束日期查询

    str_to_date('2016-08-24', '%Y-%m-%d %H') validStartTime str_to_date('2016-09-16', '%Y-%m-%d %H') val ...

  9. angularJs基础

    AngularJs是为了克服Html在构建应用上的不足而设计的.Html是一门很好的为静态文件展示设计的声明式语言,但是要构建web应用的话就显得乏力了.所以我做了一些工作来让浏览器做我瞎向要的事. ...

  10. Java中的值传递和引用传递

    这几天一直再纠结这个问题,今天看了这篇文章有点思路了,这跟C++里函数参数为引用.指针还是有很大区别. 当一个对象被当作参数传递到一个方法后,此方法可改变这个对象的属性,并可返回变化后的结果,那么这里 ...