分享2个框架插件- jquery.fileupload与艺术对话

这些是我们项目中必不可少的东西，所以今天推荐两个一个叫做艺术对话是个内联框架的框架插件，一个叫框架文件上传，我看网上很少有这个插件框架文件上传的插件使用教程，今天我就简单的介绍和写一点使用的方法！简单用代码举例子最小化的方法

复制代码代码如下：data-url是上传后执行上传文件的服务器端编程语言(专业超文本预处理器的缩写)方法输入id=' file upload ' type=' file ' name=' files[]' data-URL=' server/PHP/' multiplescript src=' http://Ajax。谷歌API。com/Ajax/libs/jquery/1。9 .1/jquery。量滴js '/script script src=' http : js/vendor/jquery。ui。小部件。js '/script script src=' http 3360 js/jquery。iframe-transport。js .fileupload({ dataType: 'json '，//josn传输done:函数(e，数据){ //上传结束后执行$.每个(data.result.files，function (index，file) { $('p/').文本（文件名)。附录(文档。身体)；});} });});/script

稍微扩展一下

复制代码代码如下：输入id='文件上传'类型='文件'名称='文件[]' multiplescript src=' http://Ajax。谷歌API。com/Ajax/libs/jquery/1。9 .1/jquery。量滴js '/script script src=' http : js/vendor/jquery。ui。小部件。js '/script script src=' http : js/jquery。iframe-transport。js '/脚本脚本src完整的应用程序接口在这里https://github.com/blueimp/jQuery-File-Upload/wiki/API我就是简单的介绍一些常用的说明$('#fileupload ').文件上传('选项',{ //设置上传事件URL : ' http://localhost/PHP/index。PHP '//指定服务器端编程语言(专业超文本预处理器的缩写)上传方法disableimageresize :/Android(？*Chrome)|Opera/.测试(窗口。领航员。用户代理)，//禁止生成缩略图maxFileSize : 5000000 //设置支持的最大尺寸acceptFileTypes: /(\ .|\/)(rar|zip|jp？g|png|bmp)$/i，//设置上传的类型});$.ajax({ url: $('#fileupload ')).fileupload('option '，' url ')，//根据设置选项创建交互式、快速动态网页应用的网页开发技术传输datatype :“JSON”，上下文： $(“#文件上载”)[0]}).完成(函数（结果){ $(这个)).文件上传('选项'，'完成').调用（这个，$。事件("完成”，{ result : result })；//上传完成后做的事情});$('#fileupload ').绑定(“文件上传完成”，函数(e，数据){ //绑定上传完执行的事件$.每个(data.result.files，function (index，file){ for(var I in file){ alert(I ' : ' file[I])} })；//绑定的事件太多了大家直接翻译过来就明白是什么意思$('#fileupload ').绑定(' fileuploadadd '，函数(e，数据){/*.*/}) .绑定(' fileuploadsubmit '，函数(e，数据){/*.*/}) .绑定(' fileuploadsend '，函数(e，数据){/*.*/}) .绑定(“文件上传完成”，函数(e，数据){/*.*/}) .绑定(“fileuploadfail”，函数(e，数据){/*.*/}) .绑定('文件上传分析'，函数(e，数据){/*.*/}) .绑定(“文件上传进度”，函数(e，数据){/*.*/}) .绑定(' fileuploadprogressall '，函数(e，数据){/*.*/}) .绑定(“fileuploadstart”，函数(e) {/*.*/}) .绑定(“文件上传停止”，函数(e) {/*.*/}) .绑定(“fileuploadchange”，函数(e，数据){/*.*/}) .绑定(“文件上传粘贴”，函数(e，数据){/*.*/}) .绑定(' fileuploaddrop '，函数(e，数据){/*.*/}) .绑定(' fileuploaddragover '，函数(e) {/*.*/}) .绑定(' fileuploadchunksend '，函数(e，数据){/*.*/}) .绑定(' fileuploadchunkdone '，函数(e，数据){/*.*/}) .绑定(' fileuploadchunkfail '，函数(e，数据){/*.*/}) .绑定('文件上传分块'，函数(e，数据){/*.*/});});});/script

由于这个插件功能很强大，方法和应用程序接口太多大家可以先看看官网的APi，当然有不懂的也可以问问我！

第二个这个其实很简单艺术对话，国人开发的，所有的应用程序接口都是汉语的，所以同学们一看就会了，这里我就说一个的了，就是内联框架关闭如何传输数据呢？

复制代码代码如下：脚本src=' http : jquery。迷你。js '/script script src=' http : art dialog。js？skin=default/script script src=' http :/plugins/IFrameTools。js '/script script src=' http :/skins/idialog。CSS//脚本标题jquery的处理/title/headscriptfunction倪好(){art.dialog.open(//打开一个内联框架远程文件http://本地主机/对话框/索引2。html '，{title : '测试的页面，宽度： 320,高度： 400,关闭：函数(){//iframe关闭时执行的警惕（我的上帝关闭了')}});}/脚本正文输入类型=' text ' id='倪好值='测试数据/a href=' JavaScript :倪好()' onclick='倪好()'提交/a

我要把index2.html数据传输回去，当然我的指数2打算点击X的时候就已经把数据传输回父内联框架的框架怎么做，下边代码

复制代码代码如下：脚本src=' http : jquery。迷你。js '/script script src=' http : art dialog。js？skin=default/script script src=' http :/plugins/IFrameTools。js '/script script src=' http :/skins/idialog。CSS//脚本标题jquery的处理/title/head dyinput type=' text ' id=' chushu ' value=' 2222111 '/script var origin=art dialog。打开。起源；var v=原点。文件。getelementbyid('倪好');价值=文件。getelementbyid(' chushu ').价值；/script

当然数据不是点击X按钮的传输可以用自带的art.dialog.data('test '，val)；这种方法来传输！事件匆忙写的比较紧，大家有不懂的找我就可以了！