默认模式
自定义按钮
皮肤选择
其它选项
API交互
非utf-8编码调用
UBB可视化
Ajax上传
插件扩展
iframe调用上传
异步加载
远程抓图
结合CKFinder
Markdown可视化
生成代码
xhEditor demo8 : Ajax文件上传
1,普通上传模式:
<p>当前实例调用的Javascript源代码为:</p><p>$('#elm1').xheditor({upLinkUrl:"upload.php",upLinkExt:"zip,rar,txt",upImgUrl:"upload.php",upImgExt:"jpg,jpeg,gif,png",upFlashUrl:"upload.php",upFlashExt:"swf",upMediaUrl:"upload.php",upMediaExt:"avi"});</p><p><br /></p><p>请确保当前目录中的upload.php有相应的PHP执行权限,若您使用的是其它的服务器脚本语言,请自行对初始化参数中的upLinkUrl、upImgUrl、upFlashUrl和upMediaUrl进行修改,并开发相应服务器上传接收程序。</p>注:upload.php仅为演示代码,若您希望在自己的项目中实际使用,请自行修改代码或者重新开发,开发过程中请注意上传文件的格式及大小限制,注意服务器安全问题。 <br /><br /><strong>上传接收程序开发规范:<br /></strong>1,上传文件域名字为:filedata<br />2,返回结构必需为json,并且结构如下:{"err":"","msg":"200906030521128703.gif"}<br />若上传出现错误,请将错误内容保存在err变量中;若上传成功,请将服务器上的绝对或者相对地址保存在msg变量中。<br />编辑器若发现返回的err变量不为空,则弹出窗口显示返回的错误内容。<br /><br /><br /><strong>上传管理方案建议:</strong><br />1,在编辑器初始化时在upload.php后面跟上一个服务器生成的绝对唯一的跟踪值,例如:upload.php?infoid=121312121<br />2,在服务器接收程序中以这个跟踪值保存到数据库中,同样可以限制单个跟踪值下总上传文件数或者总文件大小,否则就是一个可以上传无限个文件的漏洞了<br />3,最终当前表单提交时,再根据编辑器提交的HTML内容和数据库中上传内容进行比较,删除所有没有使用的上传文件<br />4,定期由服务器脚本删除上传数据库中没提交的文件记录,这样就能防止别人将您的网站作为免费相册空间了
2,立即上传模式:
<p>当前实例调用的Javascript源代码为:</p><p>$('#elm2').xheditor({upLinkUrl:"upload.php?immediate=1",upLinkExt:"zip,rar,txt",upImgUrl:"upload.php?immediate=1",upImgExt:"jpg,jpeg,gif,png",upFlashUrl:"upload.php?immediate=1",upFlashExt:"swf",upMediaUrl:"upload.php?immediate=1",upMediaExt:"avi"});</p><p><br /></p><p>若返回的地址最前面为<span style="color:#fe2419;"><strong>半角的感叹号:“!”</strong></span>,表示为<strong><span style="color:#fe2419;">立即上传模式</span></strong>,上传成功后不需要点“确定”按钮,随后自动插入到编辑器内容中。<br /></p>
3,带链接文字的附件上传:
<p>当前实例调用的Javascript源代码为:</p><p>$('#elm3').xheditor({upLinkUrl:"uploadattach.php",upLinkExt:"zip,rar,txt"});</p><p><br /></p><p><span style="color:#fe2419;"><strong>带链接文字的附件上传</strong></span>仅可在“超链接”按钮中使用,URL链接和链接文字之间用<span style="color:#fe2419;"><strong></strong></span><span style="color:#fe2419;"><strong>“||”分隔</strong></span>,例如:test.zip||download,前面为下载的URL链接,后面为超链接的文字内容,例如可以是附件的文件名。</p><p>特别说明:uploadattach.php是静态内容,仅为演示用,无论上传了什么文件都返回一个演示用的文件。</p>
4,缩略图上传模式:
<p>当前实例调用的Javascript源代码为:</p><p>$('#elm4').xheditor({upImgUrl:"uploadthumb.php",upImgExt:"jpg,jpeg,gif,png"});</p><p><br /></p><p><span style="color:#fe2419;"><strong>缩略图模式</strong></span>仅可在“图片”按钮中使用,小图和大图链接之间用<span style="color:#fe2419;"><strong>“||”分隔</strong></span>,例如:small.gif||big.html,大图链接可以是图片,也可以是URL网址。</p><p>缩略图模式可与多文件插入混合使用,例如:1.gif||1.htm 2.gif||2.html<br /></p><p>特别说明:uploadthumb.php是静态内容,仅为演示用,无论上传了什么图片都返回内置的演示图片文件。</p>
5,Flash和多媒体自定高宽上传:
<p>当前实例调用的Javascript源代码为:</p><p>$('#elm5').xheditor({upFlashUrl:"uploadembed.php",upFlashExt:"swf",upMediaUrl:"uploadembed.php",upMediaExt:"wmv,avi,wma,mp3,mid"});</p><p><br /></p><p>Flash和多媒体两个模块上传接口的3个参数分别代表:url、宽度、高度,之间用<span style="color:#ff0000;"><strong>“||”分隔</strong></span>,例如:test.swf||100||100<br /></p><p>自定高宽可与批量插入混合使用,例如:1.swf||100||100 2.swf||200||200,或者1.mp3||100||100 2.mp3||200||200</p><p>特别说明:uploadembed.php是静态内容,仅为演示用,无论上传了什么文件都返回内置的演示文件。</p>
6,上传文件URL回调:
<p>当前实例调用的Javascript源代码为:</p><p>$('#elm6').xheditor({upLinkUrl:"upload.php",upLinkExt:"zip,rar,txt",upImgUrl:"upload.php",upImgExt:"jpg,jpeg,gif,png",<span style="color:#ff0000;">onUpload:insertUpload</span>});</p><p><br /></p><p>上传文件URL回调接口onUpload可扩展编辑器内置的文件上传功能,例如可以将编辑器中上传的图片应用在文章主图片上。</p>
上传文件列表: