jquery-fileupload IE8IE9无法上传图片的BUG及如何给input[type=file]自定义样式

先说IE9,点击上传后,浏览器会提示下载内容。

原因:IE9及以下上传文件的响应头的contentType 如果是json,浏览器会以为是文件下载。

处理方法:找后台GG,把contentType改为text/html.

再修改done方法,获得地址

done: function(e, data){
    var result = data.result[0].body ? data.result[0].body.innerHTML : data.result;
    result = JSON.parse(result);
    /* 你自己的代码*/
}

再说IE8,点击上传后,出现文件选择框,但是点击确认后,浏览器不会发送ajax请求。

原因:IE8为了安全考虑,只能通过直接点击<input type="file">来上传文件。而我的做法是,隐藏input,通过另外一个按钮,来触发input的click事件。

处理方法:把另一个按钮外面套一个label,设置for="",关联input。

注意:input依然不能设置成display:none,不然IE8还是不认。所以我的做法是把input的宽高都设置成1px ,透明度设为0。或者设置z-index,把它置于最底层,但是这个方法我还没实践过。

时间: 2024-12-15 08:49:20

jquery-fileupload IE8IE9无法上传图片的BUG及如何给input[type=file]自定义样式的相关文章

jQuery动态添加input type=file文件上传域

jQuery动态添加input type=file文件上传域,当用户需要通过网页上传多个文件的时候,动态添加文件域就显得尤其重要,本功能引入了jQuery,兼容性方面也做的不错,暂时没有限制文件域的个数,所以你可以无限制的生成文件域,直到满足你的需要. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transit

&lt;input type = file/&gt;上传图片限制大小、类型判断、像素判断

<input type = file/>上传图片限制大小.类型判断.像素判断 在项目中经常用到input标签来上传文件,而这些文件通常是图片文件.图片有很多格式我们只需要其中的几种,就需要对用户上传的文件进行验证,在HTML5中有一个新的属性:accept文件类型限制.但是通常我们会用javascript或jQuery编写方法进行验证图片的大小限制.类型判断.像素判断 <!DOCTYPE html> <html> <head> <meta charse

处理同一页面中借助form+input[type=&quot;file&quot;]上传图片出现的input无法清空问题

今天下午帮同事改了这样一个bug: 在一个页面中对多张图进行上传时,由于input的value无法情况的问题,导致每次选完图片后,都跟第一张图片一样,无法出现如下效果: 百度了下思路:先将input取到,然后放到一个临时form里面清空,最后删掉form. 代码如下: 首先是生成图片选择和显示部分的绑定代码: var img_tmp = '<tr><td><input type="text" name="code" value=&quo

jQuery动态添加&lt;input type=&quot;file&quot;&gt;

有时候需要在页面上允许用户上传多个文件,个数由用户自己决定,个数多了也可以删除,使用jQuery可以很简单的实现这个功能. <!DOCTYPE html> <html> <head> <title>test.html</title> <meta http-equiv="content-type" content="text/html; charset=UTF-8"> <script typ

文件上传按钮input[type=&quot;file&quot;]按钮美化时在IE8中的bug【兼容至IE8】

首先看一下完成后的效果,鼠标移入可改变为手指的效果. 在此就不加图标了 <label class="file-upload"> <span>上传附件</span> <input type="file" name=""> </label> 在IE8中需要将input透明后还不能完全达到效果,还需要将字体设大一些,撑开input,这是IE自带的兼容问题. .file-upload{ disp

关于PHP HTML &lt;input type=&quot;file&quot; name=&quot;img&quot;/&gt;上传图片,图片大小,宽高,后缀名。

在我们的系统中,不免要上传图片,视频等文件,在上传中,需要做的一些判断,文件大小等方面. 注意: 在php.ini 中的post_max_size,upload_max_filesize默认为2M,在上传视频的时候,需要修改下,可以自行设置. 另外如果启用了内存限制,那么该值应当小于memory_limit选项的值. 在上传视频的时候,可以会需要花费些时间,当超过一定的时间,会报脚本执行超过30秒的错误,这是因为在php.ini配置文件中max_execution_time配置选项在作怪,其表示

前端实现input[type=&#39;file&#39;]上传图片预览效果

众所周知JavaScript在设计上处于安全角度考虑,是不允许读写本地文件的(原因请自行百度): 但是在实际项目应用中,经常会使用到上传图片,并且可以让用户直接预览图片.对于此种做法有两种方法可以实现:一是前后台交互,后台将图片地址返回前端: 二是,我今天写的内容,使用FileReader对象--允许Web应用程序异步读取存储在用户计算机上的文件(或原始数据缓冲区)的内容:此种方法可以优化图片加载速度,减少方法一占用带宽的问题: 但是,此种方法兼容性存在问题,主要是IE浏览器(ie10以上没问题

利用jquery来隐藏input type=&quot;file&quot;

<li> <input type="text" name="token" value = "<?php ech$_SESSION['token']; ?>"> 头像:<input type="file" id="file" style="display:none;" name ="u_img" > <img src

用jQuery重置用于文件上传的input (type=&quot;file&quot;)

页面中有如下标签: <input type="file" id="upload"/> 此标签本用于文件上传,现在有需要将其值重置为空.于是想当然地写出如下代码: $('#upload').val(''); 但经测试,该处理方法对IE无效,因为IE不允许javascript改变type为file的input的值,又是让人蛋疼的IE... 在浏览器兼容性方面本人是白痴一个,遂放狗一搜,有解决方案如下: if(ie) { // 此处判断是否是IE $('#up