jq文件上传插件
⑴ 如何使用Mason来实现文件上传
用普通的js有点儿过时了。可以采用jQuery。文件上传是网站很常见的功能之一，通过使用jQuery可以让上传过程更加人性化，更好的用户体验。
介绍20个jQuery的文件上传插件，其中有一些是教程。
1. Plupload
Plupload 是一个Web浏览器上的界面友好的文件上传模块，可显示上传进度、图像自动缩略和上传分块。可同时上传多个文件。
2. The KillersAjax Upload
该插件使用 XHR 用于上传多个文件，支持上传进度显示，但不支持 IE
3. SWFUpload jQuery Plugin
4. AjaxFileUpload
5. Uploadify
Uploadify简单说来，是基于Jquery的一款文件上传插件。它的功能特色总结如下：
支持单文件或多文件上传，可控制并发上传的文件数
在服务器端支持各种语言与之配合使用，诸如php,.NET,java……
通过参数可配置上传文件类型及大小限制
通过参数可配置是否选择文件后自动上传
易于扩展，可控制每一步骤的回调函数（onSelect, onCancel……）
通过接口参数和CSS控制外观
6. jQuery Multiple File Upload Plugin
7. jqUploader
jqUploader 是实现文件上传的jQuery插件
8. jQuery Form Plugin
jQuery Form Plugin 是一个扩展表单操作的 jQuery 插件，直接文件上传表单
9. jQuery Form Plugin
10. jqswfupload
11. uploadprogress
12. jQuery File Upload
13. Multiple File Upload With Progress Bar Using jQuery
14. jQuery.upload
一个简单的 Ajax 文件上传插件
15. Ajax File Upload Script Using jQuery
jQuery File Uploader 使用 iframe 来处理上传过程
16. jQuery Custom File Upload Input
17. Image Upload and Cropping with PHP and Jquery
18. PHP & jQuery image upload and crop
19. AJAX upload progress bars with jQuery, Django and nginx
20. Uploading Files with AJAX
21. AJAX Multiple File Upload Form Using jQuery
22. FancyUpload – Swiff meets Ajax (v3.0)
FancyUpload是一个采用Flash与Ajax（MooTools）技术实现包含上传进度条的多文件上传组件，类似于SWFUpload。MooTools是一个与prototype相类似的一个Ajax框架。
⑵ jquery怎么上传多个文件上传
jquery有个插件叫uploadify
http://www.uploadify.com/
$(function() { $("#file_upload_1").uploadify({ height : 30, swf : '/uploadify/uploadify.swf', uploader : '/uploadify/uploadify.php', width : 120 });});
⑶ jQuery实现文件上传。
/*jQuery实现文件上传，参考例子如下：
packagecom.kinth.hddpt.file.action;
importjava.io.File;
importjava.io.FileNotFoundException;
importjava.io.FileOutputStream;
importjava.io.IOException;
importjava.io.InputStream;
importjava.io.OutputStream;
importjava.util.ArrayList;
importjava.util.Calendar;
importjava.util.Enumeration;
importjava.util.Hashtable;
importjava.util.List;
importjavax.servlet.http.HttpServletRequest;
importjavax.servlet.http.HttpServletResponse;
importnet.sf.json.JSONArray;
importorg.apache.commons.logging.Log;
importorg.apache.commons.logging.LogFactory;
importorg.apache.struts.action.ActionForm;
importorg.apache.struts.action.ActionForward;
importorg.apache.struts.action.ActionMapping;
importorg.apache.struts.upload.FormFile;
importorg.hibernate.criterion.MatchMode;
importorg.hibernate.criterion.Order;
importorg.hibernate.criterion.Restrictions;
importcom.gdcn.bpaf.common.base.search.MyCriteria;
importcom.gdcn.bpaf.common.base.search.MyCriteriaFactory;
importcom.gdcn.bpaf.common.base.service.BaseService;
importcom.gdcn.bpaf.common.helper.PagerList;
importcom.gdcn.bpaf.common.helper.WebHelper;
importcom.gdcn.bpaf.common.taglib.SplitPage;
importcom.gdcn.bpaf.security.model.LogonVO;
importcom.gdcn.components.appauth.common.helper.DictionaryHelper;
importcom.kinth.common.base.action.BaseAction;
importcom.kinth.hddpt.file.action.form.FileCatalogForm;
importcom.kinth.hddpt.file.model.FileCatalog;
importcom.kinth.hddpt.file.service.FileCatalogService;
importcom.kinth.hddpt.file.util.MyZTreeNode;
/**
*<p>
*description:“文件上传的Struts层请求处理类”
*</p>
*@date:2013-1-14
*/
<FileCatalog>{
@SuppressWarnings("unused")
privatestaticLoglog=LogFactory.getLog(FileCatalogAction.class);//日志记录
;
//删除记录的同时删除相应文件
publicActionForwardfileDelete(ActionMappingmapping,ActionFormform,
HttpServletRequestrequest,HttpServletResponseresponse)
throwsException{
String[]id=request.getParameterValues("resourceId");
if(id!=null&&id[0].contains(",")){
id=id[0].split(",");
}
String[]fileUrls=newString[id.length];
for(intj=0;j<id.length;j++){
fileUrls[j]=fileCatalogService.findObject(id[j]).getFileUrl();
if(!isEmpty(fileUrls[j])){
//如果该文件夹不存在则创建一个uptext文件夹
Filefileup=newFile(fileUrls[j]);
if(fileup.exists()||fileup!=null){
fileup.delete();
}
}
fileCatalogService.deleteObject(id[j]);
}
setAllActionInfos(request);
returnlist(mapping,form,request,response);
}
@Override
publicActionForwardsave(ActionMappingmapping,ActionFormform,
HttpServletRequestrequest,HttpServletResponseresponse)
throwsException{
Stringid=request.getParameter("resourceId");
BooleanfileFlag=Boolean.valueOf(request.getParameter("fileFlag"));
if(fileFlag!=null&&fileFlag==true){
returnsuper.save(mapping,form,request,response);
}else{
StringfileUrl=this.fileUpload(form,request,id,fileFlag);
response.setContentType("text/html");
response.setCharacterEncoding("GBK");
response.setHeader("Charset","GBK");
response.setHeader("Cache-Control","no-cache");
response.getWriter().write(fileUrl);
response.getWriter().flush();
}
returnnull;
}
@SuppressWarnings("unchecked")
publicStringfileUpload(ActionFormform,HttpServletRequestrequest,Stringid,BooleanfileFlag)throwsFileNotFoundException,IOException{
request.setCharacterEncoding("GBK");
StringbasePath=getServlet().getServletConfig().getServletContext().getRealPath("")+"/";
StringfilePath="uploads/";//获取项目根路径;
/*注释部分对应jqueryuploaploadify插件的后台代码,只是还存在编码问题，默认为utf-8
StringsavePath=getServlet().getServletConfig().getServletContext().getRealPath("");//获取项目根路径
savePath=savePath+"\uploads\";
//读取上传来的文件信息
Hashtable<String,FormFile>fileHashtable=form.getMultipartRequestHandler().getFileElements();
Enumeration<String>enumeration=fileHashtable.keys();
enumeration.hasMoreElements();
Stringkey=(String)enumeration.nextElement();
FormFileformFile=(FormFile)fileHashtable.get(key);
Stringfilename=formFile.getFileName().trim();//文件名
filename=newEncodeChange().changeCode(filename);
Stringfiletype=filename.substring(filename.lastIndexOf(".")+1);//文件类型
savePath=savePath+filetype+"\";
System.out.println("path:"+savePath);
StringrealPath=savePath+filename;//真实文件路径
//如果该文件夹不存在则创建一个文件夹
Filefileup=newFile(savePath);
if(!fileup.exists()||fileup==null){
fileup.mkdirs();
}
if(!filename.equals("")){
//在这里上传文件
InputStreamis=formFile.getInputStream();
OutputStreamos=newFileOutputStream(realPath);
intbytesRead=0;
byte[]buffer=newbyte[8192];
while((bytesRead=is.read(buffer,0,8192))!=-1){
os.write(buffer,0,bytesRead);
}
os.close();
is.close();
//如果是修改操作，则删除原来的文件
Stringid=request.getParameter("resourceId");
if(!isEmpty(id)){
FileCatalogfileCatalog=fileCatalogService.findObject(id);
StringfileUrl=fileCatalog.getFileUrl();
if(!isEmpty(fileUrl)){
Filefiledel=newFile(fileUrl);
if(filedel.exists()||filedel!=null){
filedel.delete();
}
}
request.setAttribute("entity",fileCatalog);
}
response.getWriter().print(realPath);//向页面端返回结果信息
}*/
//读取上传来的文件信息
Hashtable<String,FormFile>fileHashtable=form.getMultipartRequestHandler().getFileElements();
Enumeration<String>enumeration=fileHashtable.keys();
enumeration.hasMoreElements();
Stringkey=(String)enumeration.nextElement();
FormFileformFile=(FormFile)fileHashtable.get(key);
Stringfilename=formFile.getFileName().trim();//文件名
Stringfiletype=filename.substring(filename.lastIndexOf(".")+1);//文件类型
IntegerfileSize=formFile.getFileSize();
filePath+=Calendar.getInstance().get(Calendar.YEAR)+"/"+filetype+"/";
StringrealPath=basePath+filePath+filename;//真实文件路径
if(!filename.equals("")){
//如果是修改操作，则删除原来的文件
if(!isEmpty(id)){
FileCatalogfileCatalog=fileCatalogService.findObject(id);
StringfileUrl=fileCatalog.getFileUrl();
if(!isEmpty(fileUrl)){
fileUrl=basePath+fileUrl;
Filefiledel=newFile(fileUrl);
if(filedel.exists()||filedel!=null){
filedel.delete();
}
}
request.setAttribute("entity",fileCatalog);
}
//如果该文件夹不存在则创建一个文件夹
Filefileup=newFile(basePath+filePath);
if(!fileup.exists()||fileup==null){
fileup.mkdirs();
}
//在这里上传文件
InputStreamis=formFile.getInputStream();
OutputStreamos=newFileOutputStream(realPath);
intbytesRead=0;
byte[]buffer=newbyte[8192];
while((bytesRead=is.read(buffer,0,8192))!=-1){
os.write(buffer,0,bytesRead);
}
os.close();
is.close();
}
filePath+=filename;
Stringresult="{"fileName":""+filename+"","fileType":""+filetype+"","fileSize":"+fileSize+","fileUrl":""+filePath+""}";
returnresult;
}
(){
returnfileCatalogService;
}
(){
this.fileCatalogService=fileCatalogService;
}
}
⑷ 如何使用在网上下载的JQ（比方说文件上传）插件在zend freamwork中的使用步骤是什么
在静态页面引用一下JQ。
⑸ jquery 上传文件插件uploadify jsp版本
写一个servlet，看这里
http://www.javaeye.com/topic/376101
⑹ 情况jq中有类似Element 文件上传功能的插件吗
jquery uploadify
⑺ 关于jquery file upload插件，上传中文文件，服务端那边变乱码，有人遇到过吗怎样解决
要转码 因为 Windows 的中文名 是gbk jqfileup 使用 utf8 了 所以 存储时要转码
$targetFile = iconv("utf-8","gbk",$targetFile);
⑻ jquery有哪些插件
//200多个插件如下实际开发中请选择合适的使用
1：文件上传类jQuery插件
AjaxFileUpload.
jQUploader.
MultipleFileUploadplugin.
jQueryFileStyle.
Stylinganinputtypefile.
ProgressBarPlugin.
2：表单验证类jQuery插件
jQueryValidation.
AutoHelp.
SimplejQueryformvalidation.
jQueryXAV–formvalidations.
jQueryAlphaNumeric.
MaskedInput.
TypeWatchPlugin.
Textlimiterforformfields.
AjaxUsernameCheckwithjQuery.
3:表单选择框类jQuery插件
jQueryCombobox.
jQuerycontrolleddependent(orCascadign)SelectList.
MultipleSelects.
Selectboxmanipulation.
SelectComboPlugin.
jQuery–LinkedSelect
Auto-populatemultipleselectboxes.
ChoosePlugin(SelectReplacement).
4:表单基本、输入框、选择框等jQuery插件
jQueryFormPlugin.
jQuery-Form.
jLookNiceForms.
jNice.
PingPlugin.
ToggleFormText.
ToggleVal.
jQueryFieldPlugin.
jQueryForm’nFieldplugin.
jQueryCheckboxmanipulation.
jTagging.
jQuerylabelcheck.
Overlabel.
3stateradiobuttons.
ShiftCheckboxjQueryPlugin.
WatermarkInput.
jQueryCheckbox(checkboxeswithimags).
jQuerySpinButtonControl.
jQueryAjaxFormBuilder.
jQueryFocusFields.
jQueryTimeEntry.
5:时间、日期和颜色选取类jQuery插件
jQueryUIDatepicker.
jQuerydatepickerplugin.
jQueryTimePicker.
TimePicker.
ClickPick.
TimePicker.
.
ColorPickerbyintelliance.fr.
6:投票类jQuery插件
jQueryStarRatingPlugin.
jQueryStarRater.
Contentraterwithasp.net,ajaxandjQuery.
Half-StarRatingPlugin.
7:搜索类jQuery插件
jQuerySuggest.
jQueryAutocomplete.
jQueryAutocompleteMod.
jQueryAutocompletebyAjaxDaddy.
.
jQueryAutocompleter.
AutoCompleter(TutorialwithPHP&MySQL).
quickSearchjQueryPlugin.
8:jQuery编辑器插件
jTagEditor.
WYMeditor.
jQueryjFrame.
Jeditable–editinplacepluginforjQuery.
jQueryeditable.
jQueryDisableTextSelectPlugin.
.
jQueryPlugin–AnotherIn-PlaceEditor.
TableEditor.
tEditable–inplacetableeditingforjQuery.
9:多媒体、视频、Flash等类jQuery插件
jMedia–accessiblemulti-mediaembedding.
JBEdit–AjaxonlineVideoEditor.
jQueryMP3Plugin.
jQueryMediaPlugin.
jQueryFlashPlugin.
EmbedQuickTime.
SVGIntegration.
图片类jQuery插件
ThickBox.
jQuerylightBoxplugin.
jQueryImageStrip.
jQueryslideViewer.
jQueryjqGalScroll2.0.
jQuery–jqGalViewII.
jQuery–jqGalViewIII.
jQueryPhotoSlider.
jQueryThumbs–easilycreatethumbnails.
jQueryjQIRImageReplacement.
jCarouselLite.
jQPanView.
jCarousel.
InterfaceImagebox.
ImageGalleryusingjQuery,Interface&Reflactions.
simplejQueryGallery.
jQueryGalleryMole.
EOGallery.
jQueryScrollShow.
jQueryCyclePlugin.
jQueryFlickr.
jQueryLazyLoadImagesPlugin.
Zoomi–ZoomableThumbnails.
jQueryCrop–cropanyimageonthefly.
ImageReflection.
10:Google地图类jQuery插件应用
jQueryPlugingooglemaps.
jMapsjQueryMapsFramework.
jQmaps.
jQuery&GoogleMaps.
.
jQueryJMaps–byTanePiper.
11:游戏类jQuery插件
TetriswithjQuery.
jQueryChess.
MadLibsWordGame.
jQueryPuzzle.
jQuerySolarSystem(notagamebutawesomejQueryStuff).
12:表格,网格类jQuery插件
UI/Tablesorter.
jQueryingrid.
jQueryGridPlugin.
TableFilter–awesome!.
TableEditor.
jQueryTreeTables.
Expandable“Detail”TableRows.
.
jQueryBubble.
TableSorter.
ScrollableHTMLTable.
jQuerycolumnManagerPlugin.
jQuerytableHoverPlugin.
jQuerycolumnHoverPlugin.
jQueryGrid.
TableSorterpluginforjQuery.
tEditable–inplacetableeditingforjQuery.
jQuerycharToTablePlugin.
jQueryGridColumnSizing.
jQueryGridRowSizing.
13:统计类jQuery插件
jQueryWizardPlugin.
jQueryChartPlugin.
BarChart.
14:边框、圆角、背景类jQuery插件
jQueryCorner.
jQueryCurvyCorner.
NiftyjQueryCorner.
TransparentCorners.
jQueryCornerGallery.
GradientPlugin.
14:文字和超链接类jQuery插件
jQuerySpoilerplugin.
TextHighlighting.
DisableTextSelectPlugin.
jQueryNewsticker.
Autoline-heightPlugin.
Textgrad–atextgradientplugin.
LinkLook–alinkthumbnailpreview.
pagerjQueryPlugin.
shortKeysjQueryPlugin.
jQueryBiggerlink.
jQueryAjaxLinkChecker.
15:文本提示类jQuery插件
jQueryPlugin–Tooltip.
jTip–ThejQueryToolTip.
clueTip.
BetterTip.
FlashTooltipsusingjQuery.
ToolTip.
16:菜单和导航类jQuery插件
jQueryTabsPlugin–awesome!.[demonestedtabs.]
(basedonjQueryTabsPlugin).
jQueryidTabs.
jdMenu–.
jQuerySuckerFishStyle.
jQueryPluginTreeview.
treeViewBasic.
FastFindMenu.
SlidingMenu.
LavaLampjQueryMenu.
jQueryiconDock.
jVariationsControlPanel.
ContextMenuplugin.
clickMenu.
CSSDockMenu.
jQueryPop-upMenuTutorial.
SlidingMenu.
http://stilbuero.de/jquery/tabs_3/
17:幻灯片、手风琴特效类jQuery插件
jQueryPluginAccordion.
.
haccordion–.
.de.
HoverAccordion.
AccordionExamplefromfmarcia.info.
jQueryAccordionExample.
jQueryDemo–ExpandableSidebarMenu.
SlidingPanelsforjQuery.
jQueryToggleElements.
CodaSlider.
jCarousel.
AccesibleNewsSliderPlugin.
ShowingandHidingcodeExamples.
jQueryEasingPlugin.
jQueryPortlets.
AutoScroll.
Innerfade.
18:拖放类jQuery插件
UI/Draggables.
EasyDragjQueryPlugin.
jQueryPortlets.
jqDnR–drag,dropresize.
DragDemos.
19:XMLXSLJSONFeeds相关jQuery插件
XSLTPlugin.
.
xmlObjectifier–ConvertsXMLDOMtoJSON.
jQueryXSLTransform.
jQueryTaconite–multipleDomupdates.
RSS/ATOMFeedParserPlugin.
jQueryGoogleFeedPlugin.
20:浏览器
Wresize–IEResizeeventFixPlugin.
jQueryifixpng.
jQuerypngFix.
LinkScrubber–.
jQueryPerciformes–.
BackgroundIframe.
QinIE–forproperdisplayofQtagsinIE.
jQueryAccessibilityPlugin.
jQueryMouseWheelPlugin.
21:警告,提示,确认等对话框
jQueryImpromptu.
jQueryConfirmPlugin.
jqModal.
SimpleModal.
CSS
jQueryStyleSwitcher.
JSS–JavascriptStyleSheets.
jQueryRule–creation/manipulationofCSSRules.
jPrintArea.
22:DOM、AJAX和其它JQuery插件
FlyDOM.
jQueryDimenionPlugin.
jQueryLoggin.
Metadata–extractmetadatafromclasses,attributes,elements.
Super-tinyClient-.
UndoMadeEasywithAjax.
JHeartbeat–periodicallypolltheserver.
LazyLoadPlugin.
LiveQuery.
jQueryTimers.
jQueryShareit–displaysocialbookmarkingicons.
jQueryserverCookieJar.
jQueryautoSave.
jQueryPuffer.
jQueryiFramePlugin.
CookiePluginforjQuery.
jQuerySpy–awesomeplugin.
EffectDelayTrick.
jQuick–aquicktagcreatorforjQuery..
⑼ 怎么实现跨域，异步文件上传并返回处理结果
先讲讲如何跨域，跨域方法很多，访问方式其实与本域名访问没有很大不同。简单列举几个：
使用window.postMessage实现跨域通信。
使用ajax异步加载其他网站资源，如加载QQ登陆成功的资料。
头部的css、js，img标签中的src等，都可以填写外部的链接，都算跨域。
然后再讲讲异步文件上传，异步上传和异步上传文件其实很类似，下面是使用jq的ajaxupload插件进行上传的示例
$.ajaxFileUpload({
url:'upload.action',//用于文件上传的服务器端请求地址
secureuri:false,//一般设置为false
fileElementId:'upload',//文件上传控件的id属性<inputtype="file"id="upload"name="upload"/>
dataType:'json',//返回值类型一般设置为json
success:function(data,status){//服务器成功响应处理函数
alert(data.message);//从服务器返回的json中取出message中的数据,其中message为在struts2中action中定义的成员变量
$("#img").attr("src",data.imagePath);
if(typeof(data.error)!='undefined'){
if(data.error!=''){
alert(data.error);
}else{
alert(data.message);
}
}
},
error:function(data,status,e){//服务器响应失败处理函数
alert(e);
}
});
⑽ 如何利用自定义文本框+图片来实现文件上传效果
用普通的js有点儿过时了。可以采用jQuery。文件上传是网站很常见的功能之一，通过使用jQuery可以让上传过程更加人性化，更好的用户体验。
介绍20个jQuery的文件上传插件，其中有一些是教程。
1. Plupload
Plupload 是一个Web浏览器上的界面友好的文件上传模块，可显示上传进度、图像自动缩略和上传分块。可同时上传多个文件。
2. The KillersAjax Upload
该插件使用 XHR 用于上传多个文件，支持上传进度显示，但不支持 IE
3. SWFUpload jQuery Plugin
4. AjaxFileUpload
5. Uploadify
Uploadify简单说来，是基于Jquery的一款文件上传插件。它的功能特色总结如下：
支持单文件或多文件上传，可控制并发上传的文件数
在服务器端支持各种语言与之配合使用，诸如PHP,.NET,Java……
通过参数可配置上传文件类型及大小限制
通过参数可配置是否选择文件后自动上传
易于扩展，可控制每一步骤的回调函数（onSelect, onCancel……）
通过接口参数和CSS控制外观
6. jQuery Multiple File Upload Plugin
7. jqUploader
jqUploader 是实现文件上传的jQuery插件
8. jQuery Form Plugin
jQuery Form Plugin 是一个扩展表单操作的 jQuery 插件，直接文件上传表单
9. jQuery Form Plugin
10. jqswfupload
11. uploadprogress
12. jQuery File Upload
13. Multiple File Upload With Progress Bar Using jQuery
14. jQuery.upload
一个简单的 Ajax 文件上传插件
15. Ajax File Upload Script Using jQuery
jQuery File Uploader 使用 iframe 来处理上传过程
16. jQuery Custom File Upload Input
17. Image Upload and Cropping with PHP and Jquery
18. PHP & jQuery image upload and crop
19. AJAX upload progress bars with jQuery, Django and nginx
20. Uploading Files with AJAX
21. AJAX Multiple File Upload Form Using jQuery
22. FancyUpload – Swiff meets Ajax (v3.0)
FancyUpload是一个采用Flash与Ajax（MooTools）技术实现包含上传进度条的多文件上传组件，类似于SWFUpload。MooTools是一个与prototype相类似的一个Ajax框架。
去网络，搜索这里面的名称，就能找到了。 非常强大。