//建立一個可存取到該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. Excel with COM

    COM     excelApplication ; COM     workBooks ; COM     workSheets ; COM     workSheet ; COM     work ...

  2. Maven构建项目后项目报Error错误Java compiler level does not match the version of the installed Java project fac

    项目->右键->Project Facets->修改facets中Java版本(下拉箭头出)为要用的版本 Maven构建项目需注意 1.项目右键->Preferences-&g ...

  3. 2016-11-10:win7下VMware虚拟机中CentOS6.5网络配置

    在win7环境下,使用桥接和NAT模式配置VMware虚拟机网络,实现宿主机与虚拟机以及虚拟机通过宿主机网卡访问互联网. 1 配置VMware虚拟网络编辑器 VMnet0 桥接模式 VMnet1仅主机 ...

  4. javascript call与apply关键字的作用

    apply接受两个参数.第一个参数指定函数体内this对象的指向,第二个参数为一个带下标的集合. call则是apply的语法糖,如果参数数量固定,则可以不用带下标的集合传第二个参数. 1 2 3 4 ...

  5. 应用Druid监控SQL语句的执行情况

    Druid是什么? Druid首先是一个数据库连接池.Druid是目前最好的数据库连接池,在功能.性能.扩展性方面,都超过其他数据库连接池,包括DBCP.C3P0.BoneCP.Proxool.JBo ...

  6. 使用JQuery Ajax请求,在Controller里获取Session

    昨天在做项目的时候,两个平台之间的切换,虽然两个网站的Session都指向了同一台机子,但是通过Ajax方式来请求时,就是不能获取到Session的值. 在调试的过程中发现,原来是Session的Is ...

  7. html focus事件小学问

    focus事件千万不要有alert方法,不然在有些浏览器会进入死循环的.例如:$('#test').focus(function(){ alert('dead loop'); }); 在chrome下 ...

  8. require.js 入门笔记

    网站越来越庞大,JS也是越写越多. 当所有的JS 都集中在 HTML的 head 部分时,网页加载变得很慢,很多的 JS代码也并不是全都适用在当前的页面,造成了代码的冗余度非常高. 而且长长的JS代码 ...

  9. 操作系统 页面置换算法LRU和FIFO

    LRU(Least Recently Used)最少使用页面置换算法,顾名思义,就是替换掉最少使用的页面. FIFO(first in first out,先进先出)页面置换算法,这是的最早出现的置换 ...

  10. java 中 ArrayList LinkedList Vector 三者的异同点

    1.ArrayList和Vector都是基于数组实现的,所以查询速度很快,增加和删除(非最后一个节点)速度慢: Vector是线程安全的,ArrayList不是. 2.LinkedList 是一个双向 ...