//建立一個可存取到該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. sqlce中不支持sp_rename修改表名

    The sp_rename procedure is not avialable in SQL CE! In Sql Server 2005 Management Studio you have to ...

  2. Python-6 分支 循环

    #1 循环 while 条件: 循环体 for 目标 in 表达式: 循环体   表达式可为:range(start,stop,step) break--终止当前循环,并跳出当前循环体. contin ...

  3. VMWare虚拟机 使用vmtools拷贝文件 临时文件问题

    Win7下, 临时文件会存放在路径C:\Users\admin\AppData\Local\Temp\vmware-admin\VMwareDnD,如果不及时删除,C盘就会越来越大直至放满.

  4. Raspberry pi之树莓派基础建设-2

    1.ssh pi与本地文件传输   一般ssh是默认会支持sftp的,所以你可以考虑用filezila之类的ftp工具远程连接登陆 2.我考虑到要拍照,前提是你得有个摄像头,usb直接插上去 3.py ...

  5. Jmeter beanshell 生成手机号加密签名

    首先自己写一个根据手机号生成加密字符串的函数,并且导出为Jar包,函数具体内容省略,网上有很多 将Jar包放到Jmeter lib\ext目录下面,然后在user.properties里面把路径加进去 ...

  6. STL之序列容器vector

    首先来看看vector的模板声明: template <class T, class Alloc = allocator<T>> class vector { //… }; v ...

  7. html5的FormData对象和input的file属性以及window.URL.createObjectURL( ) 方法(转载)

    /** FormData ==>表单数据 能自动把表单数据拼接打包 当ajax发送数据时,发送打包的数据; 还可以使用FormData对象的append(key,value)添加数据 FormD ...

  8. Cacti修改采集精度为1分钟

    前言: 基础知识:建议先了解一下 rrdtool 及 rrd 数据库的工作原理,参考阅读<rrdtool学习笔记> cacti主要使用了rrdtool这个工具来绘图,所以看上去比zabbi ...

  9. JS不支持正则中的负向零宽断言

    今天在项目中用到了正则表达式,并且需要用负向零宽断言 (?<=exp) 进行筛选,结果运行时报 Invalid group 错,一开始以为是自己很久没用表达式写错了,查阅了一下正则语法后发现并没 ...

  10. Swift 3 中的访问控制 open public internal fileprivate private

    Swift 3必看:新的访问控制fileprivate和open http://www.jianshu.com/p/604305a61e57 浅谈 Swift 3 中的访问控制 https://mai ...