//建立一個可存取到該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. Google Authenticator

    Google Authenticator 现在越来越多的网站采用两步验证,实现方式可能有所区别,一般来说是 1+? (1 即 普通的用户名和密码, ?可能是实物如U盾.手机短信验证码或其他).?的重点 ...

  2. DES对称性加密

    using System; using System.Security.Principal; using System.Security.Permissions; using System.Secur ...

  3. 2.1 ARM家族大检阅

    芯片名称 ARM核 指令架构 S3C2440 ARM9 ARMv4T S3C6410 ARM11 ARMv6 S5PV210 Cortex A8 ARMv7-A Cortex M工控 Cortex R ...

  4. C#实现Dll(OCX)控件自动注册的两种方法 网上找的 然后 自己试了试 还是可以用的

    尽管MS为我们提供了丰富的.net framework库,我们的程序C#开发带来了极大的便利,但是有时候,一些特定功能的控件库还是需要由第三方提供或是自己编写.当需要用到Dll引用的时候,我们通常会通 ...

  5. WebService 用法

           上文详细讨论了MQ的使用方法,MQ作为一种信息存储机制,将消息存储到了队列中,这样在做分布式架构时可以考虑将消息传送到MQ服务器上,然后开发相应的服务组件获取MQ中的消息,自动获取传送的 ...

  6. FreeMark学习(一)

    FreeMarker是一个模板引擎,一个基于模板生成文本输出的通用工具,使用纯Java编写 FreeMarker被设计用来生成HTML Web页面,特别是基于MVC模式的应用程序 虽然FreeMark ...

  7. java 获取当月第一天和最后一天 获取前一个月第一天和最后一天

    SimpleDateFormat format = new SimpleDateFormat("yyyy-MM-dd");                    //获取前月的第一 ...

  8. Hibernate框架简单应用

    Hibernate框架简单应用 Hibernate的核心组件在基于MVC设计模式的JAVA WEB应用中,Hibernate可以作为模型层/数据访问层.它通过配置文件(hibernate.proper ...

  9. isMemberOfClass和isKindOfClass的区别

    1.isMemberOfClass:作用:用于判断一个对象是否属于当前这个类   Person *rose = [[Person alloc] init];          if ([rose is ...

  10. dos命令记录以及dos下通过进程id查找工作路径

    dos命令 tasklist |findstr "1696" 通过进程id查看进程名 tasklist 列出所有进程 netstat -ano 查看当前网络通信进程连接的各种状态 ...