基于uploadify封装的jsp的tag标签

最新推荐文章于 2017-01-12 16:21:13 发布
最新推荐文章于 2017-01-12 16:21:13 发布
阅读量84 收藏
点赞数
文章标签： python javascript java ViewUI
原文链接：https://my.oschina.net/u/185335/blog/82875
版权

2019独角兽企业重金招聘Python工程师标准>>> hot3.png

package com.util.tag.html;

import java.io.IOException;
import java.io.Writer;
import java.util.Random;
import javax.servlet.jsp.JspException;
import javax.servlet.jsp.tagext.BodyTagSupport;

import org.apache.struts2.ServletActionContext;


/**
 * @author yao
 */
public class UploadifyTag extends BodyTagSupport {
//项目路径
private String basePath = null; //必填
//input type=file 元素
private String id = null;
private String name = null;
//form 表单
private String formID = null; //必填
//auto=false时上传button的ID
private String uploadButtonId = null;
//属性
private String fileTypeExts = "*"; //必填 //文件过滤
private String fileSizeLimit = "2MB";//必填 //文件上传大小
private String fileObjName = "file";  //必填 //后台接收的名字
private String buttonClass = "button"; 
private String fileTypeDesc = "Upload Files"; //文件描述
private String method = "POST";
private String swf = "plugin/uploadify/uploadify.swf";
private boolean removeCompleted = true;
private boolean auto = true;
private boolean overideUploadStart = false;
private boolean multi = false;
private int uploadLimit = 1 ;
private int queueSizeLimit = 1;
private String queueHeight = "30px";
private String uploader = null;  //上传路径
private String queueID = null;  //进度条展示区域ID
//方法
private String uploadStart = null; 
private String uploadSuccess = null;
private String onSelect = null;
private String onUploadComplete = null;
private boolean onlyLibs = false;
//jquery跟uploadify文件地址
private String jqlibs = "plugin/jquery-1.7.1.min.js";
private String uploadifyjs = "plugin/uploadify/jquery.uploadify-3.1.js";
private String uploadifycss = "plugin/uploadify/uploadify.css";
/**
* 主入口方法
*/
@Override
public int doStartTag() throws JspException {
Writer writer = this.pageContext.getOut();
String path = basePath ;
id = (id==null)?getFileElementId():id;
StringBuffer totalStr = getLibs(path);
if(!onlyLibs){
StringBuffer js = getJS(path, id, uploadButtonId);
StringBuffer fileElement = getFileElement(id);
totalStr = totalStr.append(js.append(fileElement));
}
try {
writer.write(totalStr.toString());
} catch (IOException e) {
throw new JspException(e);
}
return super.doStartTag();
}
/**
* 加载js库
* @param path
* @return
*/
public StringBuffer getLibs(String path) {
StringBuffer sb = new StringBuffer();
sb.append("<script  type=\"text/javascript\"  src=\"").append(path).append(jqlibs).append("\"></script>\n");
sb.append("<script  type=\"text/javascript\"  src=\"").append(path).append(uploadifyjs).append("\"></script>\n");
sb.append("<link  type=\"text/css\" rel=\"stylesheet\" href=\"").append(path).append(uploadifycss).append("\">\n");
return sb;
}

/**
* 拼装js
* @param path 项目路径
* @param id input type=file元素ID
* @param uploadButtonId 提交按钮ID
*/
public StringBuffer getJS(String path, String id, String uploadButtonId) {
StringBuffer sb = new StringBuffer();
String tab = "    ";
sb.append("<SCRIPT LANGUAGE=\"JavaScript\">\n");
sb.append(tab).append("$(function() {\n");
//获取form的action,用作uploader的跳转地址
sb.append(tab).append("var uploader = $(\"#").append(formID).append("\").attr('action');").append("\n");
//uploadify开始
sb.append(tab).append("$(\"#").append(id).append("\").uploadify({ \n");
//uploadify属性拼装
sb.append(tab).append(tab).append("'fileTypeExts' : '").append(fileTypeExts).append("',\n");
sb.append(tab).append(tab).append("'fileSizeLimit' : '").append(fileSizeLimit).append("',\n");
sb.append(tab).append(tab).append("'fileObjName' : '").append(fileObjName).append("',\n");
sb.append(tab).append(tab).append("'buttonClass' : '").append(buttonClass).append("',\n");
sb.append(tab).append(tab).append("'fileTypeDesc' : '").append(fileTypeDesc).append("',\n");
sb.append(tab).append(tab).append("'method' : '").append(method).append("',\n");
sb.append(tab).append(tab).append("'swf' : '").append(path).append(swf).append("',\n");
sb.append(tab).append(tab).append("'removeCompleted' : ").append(removeCompleted).append(",\n");
if (null!=uploadButtonId){auto=false;}  sb.append(tab).append(tab).append("'auto' : ").append(auto).append(",\n");
sb.append(tab).append(tab).append("'multi' : ").append(multi).append(",\n");
sb.append(tab).append(tab).append("'uploadLimit' : ").append(uploadLimit).append(",\n");
sb.append(tab).append(tab).append("'queueSizeLimit' : ").append(queueSizeLimit).append(",\n");
sb.append(tab).append(tab).append("'queueHeight' : '").append(queueHeight).append("',\n");
sb.append(tab).append(tab).append("'uploader' : "); if(null==uploader) {sb.append("uploader");} else{sb.append(uploader);} sb.append(" ,\n");
if(null!=queueID) sb.append(tab).append(tab).append("'queueID' : '").append(queueID).append("',\n");
sb.append(tab).append(tab).append("'onUploadStart' : function() {\n"); if (!overideUploadStart) {sb.append(tab).append(tab).append(tab).append("callSetting(getFormData_").append(id).append("());\n");} else{sb.append(tab).append(tab).append(tab).append("callSetting(").append(uploadStart.replace(";", "")).append(")").append(";\n");}sb.append(tab).append(tab).append("}, \n");
sb.append(tab).append(tab).append("'onUploadSuccess' : function(file, data, response) {\n"); if(null != uploadSuccess) {sb.append(tab).append(tab).append(tab).append(uploadSuccess.replace(";", "")).append(";");};sb.append(tab).append(tab).append("}, \n");
sb.append(tab).append(tab).append("'onSelect' : function() {");if (null != onSelect) {sb.append(onSelect);} sb.append("},\n");
sb.append(tab).append(tab).append("'onUploadComplete' : function(file) {");if (null != onUploadComplete) {sb.append(onUploadComplete);}sb.append("},\n");
sb.append(tab).append(tab).append("'onError' : function (event,ID,fileObj,errorObj) {\n");sb.append(tab).append(tab).append(tab).append("alert(errorObj.type + ' Error: ' + errorObj.info);\n");sb.append(tab).append(tab).append("} \n");
//uploadify结束
sb.append(tab).append("});\n");
//动态设置formData属性的值
sb.append(tab).append("var callSetting = function(data){"); sb.append("$(\"#").append(id).append("\").uploadify('settings','formData',eval('('+data+')'));};\n");
//获取表单input元素的信息
sb.append(tab).append("var getFormData_").append(id).append(" = function(){\n");
sb.append(tab).append(tab).append("var str = \"\";\n");
sb.append(tab).append(tab).append("$(\"#").append(formID).append("\").children(\":input\").each(function(){\n");
sb.append(tab).append(tab).append(tab).append("var name  = $(this).attr(\"name\");\n");
//设置过滤信息 sb.append("if(name!='_eosFlowDataContext'&&name!='_eosFlowKey'){\n");
sb.append(tab).append(tab).append(tab).append("var value = $(this).val();\n");
sb.append(tab).append(tab).append(tab).append("str = str +\"'\"+name+ \"':'\" + value+\"',\"\n");
// sb.append("}");
sb.append(tab).append(tab).append("});\n");
sb.append(tab).append(tab).append("return \"{\"+str.substring(0,str.length-1)+\"}\";\n");
sb.append(tab).append("};\n");
//设置提交按钮提交事件
if (null != uploadButtonId) {sb.append("$('#").append(uploadButtonId).append("').click(function(){$('#").append(id).append("').uploadify('upload','*');});");}
sb.append("});\n</SCRIPT>\n");
return sb;
}
/**
* @param id input type=file元素ID
* @return 返回拼装完成后的input type=file 元素
*/
public StringBuffer getFileElement(String id) {
StringBuffer sb = new StringBuffer();
if (null == name) { name = id; }
sb.append("<input type=\"file\" name=\"").append(name).append("\" id=\"").append(id).append("\" />");
return sb;
}

/**
* @return 返回随机input type=file元素id
*/
public String getFileElementId() {
char[] str = { '0', '1', '2', '3', '4', '5', '6', '7', '8', '9' };
StringBuffer saveName = new StringBuffer();
saveName.append("fileUpload");
for (int n = 0; n < 4; n++) {
saveName.append(str[new Random().nextInt(str.length)]);
}
return saveName.toString();
}

public String getBasePath() {
return basePath;
}

public void setBasePath(String basePath) {
this.basePath = basePath;
}

public String getId() {
return id;
}

public void setId(String id) {
this.id = id;
}

public String getName() {
return name;
}

public void setName(String name) {
this.name = name;
}

public String getFormID() {
return formID;
}

public void setFormID(String formID) {
this.formID = formID;
}

public String getUploadButtonId() {
return uploadButtonId;
}

public void setUploadButtonId(String uploadButtonId) {
this.uploadButtonId = uploadButtonId;
}

public String getFileTypeExts() {
return fileTypeExts;
}

public void setFileTypeExts(String fileTypeExts) {
this.fileTypeExts = fileTypeExts;
}

public String getFileSizeLimit() {
return fileSizeLimit;
}

public void setFileSizeLimit(String fileSizeLimit) {
this.fileSizeLimit = fileSizeLimit;
}

public String getFileObjName() {
return fileObjName;
}

public void setFileObjName(String fileObjName) {
this.fileObjName = fileObjName;
}

public String getButtonClass() {
return buttonClass;
}

public void setButtonClass(String buttonClass) {
this.buttonClass = buttonClass;
}

public String getFileTypeDesc() {
return fileTypeDesc;
}

public void setFileTypeDesc(String fileTypeDesc) {
this.fileTypeDesc = fileTypeDesc;
}

public String getMethod() {
return method;
}

public void setMethod(String method) {
this.method = method;
}

public String getSwf() {
return swf;
}

public void setSwf(String swf) {
this.swf = swf;
}

public boolean isRemoveCompleted() {
return removeCompleted;
}

public void setRemoveCompleted(boolean removeCompleted) {
this.removeCompleted = removeCompleted;
}

public boolean isAuto() {
return auto;
}

public void setAuto(boolean auto) {
this.auto = auto;
}

public boolean isOverideUploadStart() {
return overideUploadStart;
}

public void setOverideUploadStart(boolean overideUploadStart) {
this.overideUploadStart = overideUploadStart;
}

public boolean isMulti() {
return multi;
}

public void setMulti(boolean multi) {
this.multi = multi;
}

public int getUploadLimit() {
return uploadLimit;
}

public void setUploadLimit(int uploadLimit) {
this.uploadLimit = uploadLimit;
}

public int getQueueSizeLimit() {
return queueSizeLimit;
}

public void setQueueSizeLimit(int queueSizeLimit) {
this.queueSizeLimit = queueSizeLimit;
}

public String getQueueHeight() {
return queueHeight;
}

public void setQueueHeight(String queueHeight) {
this.queueHeight = queueHeight;
}

public String getUploader() {
return uploader;
}

public void setUploader(String uploader) {
this.uploader = uploader;
}

public String getQueueID() {
return queueID;
}

public void setQueueID(String queueID) {
this.queueID = queueID;
}

public String getUploadStart() {
return uploadStart;
}

public void setUploadStart(String uploadStart) {
this.uploadStart = uploadStart;
}

public String getUploadSuccess() {
return uploadSuccess;
}

public void setUploadSuccess(String uploadSuccess) {
this.uploadSuccess = uploadSuccess;
}

public String getOnSelect() {
return onSelect;
}

public void setOnSelect(String onSelect) {
this.onSelect = onSelect;
}

public String getOnUploadComplete() {
return onUploadComplete;
}

public void setOnUploadComplete(String onUploadComplete) {
this.onUploadComplete = onUploadComplete;
}

public boolean isOnlyLibs() {
return onlyLibs;
}

public void setOnlyLibs(boolean onlyLibs) {
this.onlyLibs = onlyLibs;
}
}

-------------------------------------------------------------------------------------------------
<tag>
<name>fileUpload</name>
<tagclass>com.util.tag.html.UploadifyTag</tagclass>
<bodycontent>empty</bodycontent>
<!-- 必填 -->
<attribute>
<name>basePath</name>
<required>true</required>
<rtexprvalue>true</rtexprvalue>
</attribute>
<attribute>
<name>formID</name>
<required>true</required>
<rtexprvalue>true</rtexprvalue>
</attribute>
<attribute>
<name>fileTypeExts</name>
<required>true</required>
<rtexprvalue>true</rtexprvalue>
</attribute>
<attribute>
<name>fileSizeLimit</name>
<required>true</required>
<rtexprvalue>true</rtexprvalue>
</attribute>
<attribute>
<name>fileObjName</name>
<required>true</required>
<rtexprvalue>true</rtexprvalue>
</attribute>
<!-- 可选 -->
<attribute>
<name>id</name>
<required>false</required>
<rtexprvalue>true</rtexprvalue>
</attribute>
<attribute>
<name>name</name>
<required>false</required>
<rtexprvalue>true</rtexprvalue>
</attribute>
<attribute>
<name>uploadButtonId</name>
<required>false</required>
<rtexprvalue>true</rtexprvalue>
</attribute>
<attribute>
<name>buttonClass</name>
<required>false</required>
<rtexprvalue>true</rtexprvalue>
</attribute>
<attribute>
<name>fileTypeDesc</name>
<required>false</required>
<rtexprvalue>true</rtexprvalue>
</attribute>
<attribute>
<name>method</name>
<required>false</required>
<rtexprvalue>true</rtexprvalue>
</attribute>
<attribute>
<name>swf</name>
<required>false</required>
<rtexprvalue>true</rtexprvalue>
</attribute>
<attribute>
<name>removeCompleted</name>
<required>false</required>
<rtexprvalue>true</rtexprvalue>
</attribute>
<attribute>
<name>auto</name>
<required>false</required>
<rtexprvalue>true</rtexprvalue>
</attribute>
<attribute>
<name>overideUploadStart</name>
<required>false</required>
<rtexprvalue>true</rtexprvalue>
</attribute>
<attribute>
<name>multi</name>
<required>false</required>
<rtexprvalue>true</rtexprvalue>
</attribute>
<attribute>
<name>uploadLimit</name>
<required>false</required>
<rtexprvalue>true</rtexprvalue>
</attribute>
<attribute>
<name>queueSizeLimit</name>
<required>false</required>
<rtexprvalue>true</rtexprvalue>
</attribute>
<attribute>
<name>queueHeight</name>
<required>false</required>
<rtexprvalue>true</rtexprvalue>
</attribute>
<attribute>
<name>uploader</name>
<required>false</required>
<rtexprvalue>true</rtexprvalue>
</attribute>
<attribute>
<name>queueID</name>
<required>false</required>
<rtexprvalue>true</rtexprvalue>
</attribute>
<attribute>
<name>uploadStart</name>
<required>false</required>
<rtexprvalue>true</rtexprvalue>
</attribute>
<attribute>
<name>uploadSuccess</name>
<required>false</required>
<rtexprvalue>true</rtexprvalue>
</attribute>
<attribute>
<name>onSelect</name>
<required>false</required>
<rtexprvalue>true</rtexprvalue>
</attribute>
<attribute>
<name>onUploadComplete</name>
<required>false</required>
<rtexprvalue>true</rtexprvalue>
</attribute>
<attribute>
<name>onlyLibs</name>
<required>false</required>
<rtexprvalue>true</rtexprvalue>
</attribute>
</tag>


转载于:https://my.oschina.net/u/185335/blog/82875

weixin_34239592
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
uploadify上传之jsp
11-18
uploadify上传之jsp
JQuery Uploadify 基于JSP的无刷新上传实例
weixin_30361753的博客
10-15 72
项目需要实现一个无刷新批量文件上传功能，仔细研究了下，发现JQuery 提供的Uploadify插件十分不错，不过官方的实例是基于php的，下面我用jsp+servlet简单实现了这个功能，废话少说，先看效果图： 1、初始化页面： 2、选择多个文件（可一次多选）后： 3、点击开始上传（上传完就自动消失） 效果就是上面那样，页面不刷新。下面上代码： 1、首先先到官网下载最...
Web开发中的文件上传组件uploadify的使用
weixin_33937499的博客
12-01 86
在Web开发中，有很多可以上传的组件模块，利用HTML的File控件的上传也是一种办法，不过这种方式，需要处理的细节比较多，而且只能支持单文件的操作。在目前Web开发中用的比较多的，可能uploadify（参考http://www.uploadify.com/）也算一个吧，不过这个版本一直在变化，他们的脚本调用也有很大的不同，甚至调用及参数都一直在变化，很早的时候，那个Flash的按钮文字还没法变...
JSP中Uploadify插件的使用（jQuery上传插件）
yy954744913的博客
06-27 450
1、下载最新的zip压缩包 http://www.uploadify.com  2、从其中提取文件。     下载插件安装包后，可以看到官方给出的例子。里面文件夹的几个主要文件：jquery.uploadify.js(完成上传功能的脚本文件，在调用页面引用)、uploadify.css(外观样式表)、uploader.swf(上传控件的主体文件，flash控件)、upload.php(服务
JSP使用文件上传插件uploadify .
08-13
JSP使用文件上传插件uploadify ,内附带最新版本的uploadify。欢迎学习交流。本文章地址http://blog.csdn.net/tianba8/article/details/9953383，欢迎交流学习。
基于Uploadify+jsp文件上传刷新
04-28
本篇文章将深入探讨基于Uploadify+jsp的文件上传刷新技术。 首先，Uploadify是一个基于Flash和jQuery的文件上传组件，它提供了丰富的自定义选项，包括文件类型限制、进度条显示、多文件同时上传等。其主要优势在于...
uploadify JSP的上传例子
06-24
通过以上步骤，我们就完成了Uploadify与JSP的集成，实现了基于Java的文件上传功能。这个过程涵盖了前端交互、后端处理以及文件验证等多个方面，对于理解Web开发中的文件上传机制具有很好的实践意义。同时，这个例子...
JQuery Uploadify 基于JSP的无刷新上传实例：
08-03
《JQuery Uploadify基于JSP的无刷新上传实例详解》 在现代Web开发中，用户交互体验至关重要，其中文件上传功能是不可或缺的一部分。传统的文件上传方式通常需要页面刷新，这在用户体验上存在明显的不足。JQuery ...
jsp uploadify_v3.2 代码
03-09
`jsp uploadify_v3.2` 是一个基于Java Servlet和JavaScript的文件上传解决方案，它允许用户在网页上实现多文件的快速、便捷上传。在这个版本中，`uploadify`库结合了JSP（JavaServer Pages）技术，为Web开发者提供了...
Jsp JQuery uploadify3.1 文件上传示例
05-11
摘要:JSP源码,博客日记,uploadify,文件上传 JQuery uploadify3.1 jsp servlet文件上传实例，内附源码，jsp+servlet实现，适合初学者，网络上很多的例子虽然说是3.1版本的，但是调用方法都是老版本的，跑不起来，...
uploadifyv3.1示例---jsp版
08-04
最近需要做一个批量上传图片的功能 用了很多方法，有的很复杂，有的没有成功 最后用了uploadify，去网上下了个最新的3.1版本，但是网上多数都是2.×的例子，已经有很多配置不一样了。 所以自己写了一个uploadify-v3.1图片上传功能
uploadify-html5上传插件-jsp例子和api
02-22
本zip包中包含uploadify上传插件的html5工具，以及jsp中引用上传插件的例子。希望对大家有所帮助。
利用uploadify封装好的多附件上传JS组件
02-14
用例: $("#fileBtn").imgupload({'queueId' : 'queue', 'type' : 'product'}); 封装好的工具: (function($) { $.fn.extend({ imgupload:function(params, callback) { var selector = this.selector; ............
利用jsp+uploadify插件实现附件上传到ftp服务器的功能
时光匆匆独白 将颠沛磨成卡带
05-11 7974
这个周中午闲暇的时候研究了一下uploadify插件的使用，主要是想要实现一个附件上传的功能，看之前公司同事好像用过这个插件，但是见人家挺忙的，我只能找到她写的源码自己研究了，好来，话不多说，先把实现的效果贴出来给大家看看： 这是还未点击上传附件的界面（图：1） 当点击选择附件界面会弹出文件选择对话框如下： 选择好要上传的文件点击打开按钮，文件开始上传：
利用jsp+uploadify插件实现附件下载
时光匆匆独白 将颠沛磨成卡带
05-13 693
基于之前写的博文：利用jsp+uploadify插件实现附件上传到ftp服务器的功能 今天中午写了一下从ftp服务器下载文件的功能，实现效果如下： 其实实现也是在之前的代码上面做了一些修改： 改动地方（1）：itemTemplate上传队列模板 //附件相关 var itemTemplate = '<div id="{fileI
uploadify上传插件
wei_lanSe的博客
01-12 417
jsp页面代码 $("#uploadify").uploadify({   'swf' : "${pageContext.request.contextPath}/static/js/uploadify/uploadify.swf",  'uploader'  : '${pageContext.request.contextPath}/document/uploadFile',  'que
jquery插件 jsp+servlet+uploadify3.1 文件上传
热门推荐
giianhui的专栏
07-18 1万+
网络上很多的例子虽然说是3.1版本的，但是调用方法都是老版本的，跑不起来，经过查看doc，下面的例子可以在tomcat中正常运行。 index.jsp <% String path = request.getContextPath(); String basePath = request.getScheme() + "://" + reque
Uploadify中文API详解与实现步骤
"Uploadify中文最新API - 一个基于jQuery和Flash的文件上传插件，用于实现用户友好的多文件上传功能。" Uploadify是一个流行的JavaScript插件，它结合了jQuery和Flash技术，允许用户在网站上方便地进行多文件上传。...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值