官方demo修改后的webuploader上传预览图片（兼容IE8） github下载回来的有问题

注意！！！！！

不要使用GitHub上下载回来的webuploader.js，下载回来的webuploader.js会报错 fn 未定义

方便的话去看百度官网的demo 浏览器将其抓包获取webuploader.js文件

<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <title>WebUploader演示</title>
    <link rel="stylesheet" type="text/css" href="css/webuploader.css" />
    <link rel="stylesheet" type="text/css" href="css/style.css" />
</head>
<body>
    <div id="wrapper">
        <div>
            <div id="uploader">
                <div class="queueList">
                        <div id="dndArea">
                        <div id="filePicker">
                            <img src="img/messages-plus.png" />
                        </div>
                    </div>
                </div>
               <!-- <div id="filePicker2"></div>-->
                <br /><br /><br />
                <div class="uploadBtn webuploader-pick">开始上传</div>
            </div>
        </div>
    </div>
    <script type="text/javascript" src="js/jquery-1.11.1.min.js"></script>
    <script type="text/javascript" src="js/webuploader.js"></script>
    <script type="text/javascript" src="js/upload.js"></script>
</body>
</html>

时间： 2025-01-13 02:49:29

官方demo修改后的webuploader上传预览图片（兼容IE8） github下载回来的有问题的相关文章

上传预览图片

//上传预览 function showFile(data){ var thisfile = $(data).children('input')[0]; contentLoaded(thisfile) } function ProcessFile(items) { var file = $(items).prop ('files')[0]; var img = $(items).parent().parent().prev()[0]; if ( file) { var reader = new

图片上传预览，兼容IE6，IE8

<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Document</title> <script type="text/javascript" src="http://libs.baidu.com/jquery/1.10.2/jquery.min.js"></script> <

jQuery插件ImgAreaSelect 实例讲解一（头像上传预览和裁剪功能）

上一节随笔中,我们已经知道了关于jQuery插件ImgAreaSelect基本的知识:那么现在看一下实例: 首先,要知道我们应该实现什么功能? (1)图片能够实现上传预览功能 (2)拖拽裁剪图片,使其能够显示裁剪后的区域 (3)显示要裁剪区域的坐标其次,该如何引用该插件呢? 那就具体看一下吧! 第一步:先将样式和文件包引入(根据你自己的位置引入)  <link rel="stylesheet" type=&qu

JavaScript 图片上传预览效果

图片上传预览是一种在图片上传之前对图片进行本地预览的技术.使用户选择图片后能立即查看图片,而不需上传服务器,提高用户体验.但随着浏览器安全性的提高,要实现图片上传预览也越来越困难.不过群众的智慧是无限的,网上已经有很多变通或先进的方法来实现.例如ie7/ie8的滤镜预览法,firefox 3的getAsDataURL方法.但在opera.safari和chrome还是没有办法实现本地预览,只能通过后台来支持预览.在研究了各种预览方法后,作为总结,写了这个程序,跟大家一起分享.上次写的简便无刷新文

图片上传预览

例1: 1.先创建一个file表单域,我们需要用它来浏览本地文件. <form name="form1" id="form1" method="post" action="upload.php"> <input type="file" name="file1" id="file1" /> </form> 2.试下效果: 判断文件类型

ux.plup.File plupload 集成 ux.plup.FileLis 批量上传预览

1 //plupload 集成 2 Ext.define('ux.plup.File', { 3 extend: 'Ext.form.field.Text', 4 xtype: 'plupFile', 5 alias: ['widget.plupFile'], 6 requires: ['Ext.form.trigger.Component', 'Ext.button.Button', 'Ext.window.Toast'], 7 //plup对象 8 uploader: null, 9 //上

多图片上传预览功能

//下面用于多图片上传预览功能 function setImagePreviews(avalue) { var docObj = document.getElementById("doc"); var dd = document.getElementById("dd"); dd.innerHTML = ""; var fileList = docObj.files; for (var i = 0; i < fileList.length;

移动端图片上传预览

前天要做wap版的图片上传预览,找了好半天才找到比较适合的插件,我在该插件的基础上修改了一些东西,比如:上传后的图片删除后不能再添加.不能限制上传图片的数量. input虽然有multiple(多选),但是android目前是不支持的. 该插件控制不了不能上传同一张图片,暂时没有思路解决这个问题(:′д｀)ゞ 1 <!DOCTYPE html> 2 <html lang="zh-cn"> 3 4 <head> 5 <meta charset=&

JS实现图片上传预览效果：方法一