jquery.fileupload.js插件使用初探--单图片上传预览

最新推荐文章于 2025-10-25 16:45:36 发布

原创

最新推荐文章于 2025-10-25 16:45:36 发布 · 2.1k 阅读

收录于

当前文章被以下社区和专栏收录：

本文介绍了如何使用jquery.fileupload.js插件进行单图片上传预览。核心文件包括jQuery、jQuery UI Widget、iframe数据传输和File Upload核心类。在前端设置后，配合后台PHP代码，实现上传预览功能。同时提供了官方文档和示例资源链接。

一、官方插件下载地址：http://plugins.jquery.com/blueimp-file-upload/
下载下来后会发现里面包含了一堆文件，首先需要弄清楚的是最核心的部分是哪些，根据官方的例子可以知道，一个最简单的jQuery File Upload上传组件，必须包括以下文件：

jQuery核心库，建议使用jQuery 1.8以上版本
js/vendor/jquery.ui.widget.js ：jQuery UI Widget
js/jquery.iframe-transport.js ：扩展iframe数据传输
js/jquery.fileupload.js ： jQuery File Upload核心类
js/cors/jquery.xdr-transport.js：在IE下应载入此文件解决跨域问题

二、载入这几个必备文件后，就开始单图片上传预览的前台代码了：

<!DOCTYPE html>
<html>
<head>
    <title>jquery.fileupload.js使用测试</title>
    <script src="https://blog.csdn.net/jquery-1.12.0.min.js"></script>
    <script src="https://blog.csdn.net/jquery.ui.widget.js"></script>
    <script src="https://blog.csdn.net/jquery.iframe-transport.js"></script>
    <

标签