默认模式
自定义按钮
皮肤选择
其它选项
API交互
非utf-8编码调用
UBB可视化
Ajax上传
插件扩展
iframe调用上传
异步加载
远程抓图
结合CKFinder
Markdown可视化
生成代码
xhEditor demo10 : showIframeModal接口的iframe文件上传
1,iframe单文件上传演示:
<p>当前实例调用的Javascript源代码为:</p><p>$('#elm1').xheditor({skin:'vista',upLinkUrl:"!uploadgui.php",upImgUrl:"!uploadgui.php",upFlashUrl:"!uploadgui.php",upMediaUrl:"!uploadgui.php"});</p><p><br /></p><p>本页面演示通过showIframeModal接口来调用iframe调用指定的文件上传页来上传和管理文件,可以实现高可定义的文件上传和管理,当前示例页面中在“<strong>超链接、图片、Flash动画和视频</strong>”按钮中实现了演示。</p>
<p>此功能可在以下4个按钮中通过参数调用来实现:超链接、图片、动画和视频,接口分别为:upLinkUrl、upImgUrl、upFlashUrl和upMediaUrl,默认这几个函数为编辑器内置的ajax式文件上传,想要在frame中调用自定义上传管理页面,必需在参数值最前面添加感叹号:“!”,注意必需为半角符号。例如:upLinkUrl:'!gui.html'</p>
<p>上传管理页面可使用接口:callback,callback用来返回上传或者选择的文件链接并关闭模式窗口,您可以查看uploadgui.php页面来了解具体的管理页面制作示例</p>
2,iframe多文件批量上传演示:
<p>当前实例调用的Javascript原代码为:</p><p>$('#elm2').xheditor({skin:'vista',upImgUrl:'!{editorRoot}xheditor_plugins/multiupload/multiupload.html?uploadurl={editorRoot}demos/upload.php%3Fimmediate%3D1&ext=图片文件(*.jpg;*.jpeg;*.gif;*.png)',upFlashUrl:'!{editorRoot}xheditor_plugins/multiupload/multiupload.html?uploadurl={editorRoot}demos/upload.php%3Fimmediate%3D1&ext=Flash动画(*.swf)',upMediaUrl:'!{editorRoot}xheditor_plugins/multiupload/multiupload.html?uploadurl={editorRoot}demos/upload.php%3Fimmediate%3D1&ext=多媒体文件(*.wmv;*.avi;*.wma;*.mp3;*.mid)'});</p><p><br /></p><p>本演示仅是在上面的iframe单文件演示基础上的更进一步应用。多文件批量接口可在:<strong>超链接、图片</strong>、<strong>Flash动画</strong>和<strong>多媒体</strong>中使用,使用的方法仅需将多个URL地址用制表符(\t )来分隔,例如:1.gif 2.gif 3.gif</p><p>本演示利用showIframeModal接口来调用批量上传页面,批量上传页是结合了开源的<strong>swfupload</strong>组件来实现的,可实现高可定制的批量上传。而界面是参考了<strong>SwfUploadPanel</strong>组件,在此一并感谢。批量上传演示页的代码并没有太多的整理和优化,因此建议大家使用时再自己另行修改和开发,此模块仅供参考。<br /></p><p>注:批量上传演示页默认使用了立即上传模式,上传完成便会自动插入到编辑器中。<br /></p><p>感谢名单:</p><ol><li><a target="_blank" href="http://swfupload.org/">http://swfupload.org/</a></li><li><a target="_blank" href="http://www.extjs.com/learn/Extension:SwfUploadPanel">http://www.extjs.com/learn/Extension:SwfUploadPanel</a></li></ol>