首先需要用到两个组件. SWFupload 和 tinymce ，参考这个我写的这个贴子.

 Yii实战中8个必备常用的扩展,模块和widget

上面有详细的图片，你可以作为参考设计， 以下是你将会遇到的问题和一些步骤.

1. SWFUpload Flash与Yii Cookie的问题 , 首先你需要在入口文件 index.php 增加一行

 

1
if(isset($_POST['PHPSESSID']))    $_COOKIE['PHPSESSID'] = $_POST['PHPSESSID'];

 

2. 因Yii的安全限制，在你的过滤器中需要 'accessControl - ajaxUploadFiles' , ajaxUploadFiles改为你对应action名称

 

1
2
3
4
5
6
publicfunctionfilters() {
                returnarray(
 
                'accessControl - ajaxUploadFiles',
        );
        }

 

3. 你需要使用Yii form 客户端或者Ajax验证，页面不能刷新。

4. 图片上传缩略图处理，上传完成后在页面使用Ajax同步显示缩略图中，在其中增加一个插入按钮。

5. tinyMCE提供了很多接口可以插入内容，使用tinyMCE.execCommand 命令插入,

 

1
tinyMCE.execCommand('mceInsertContent',false,'<img src="http://darwinwen.blog.163.com/blog/+imgsrc+">'');

 

6.剩下的就是保存问题，这个你根据你自己的业务需求来完成。

延伸扩展：

如果你有时间可以考虑再增加 设置封面，使用正则表达式解析自己的标签，删除，标题描述等等很多功能,例:

tinyMCE.execCommand('mceInsertContent',false,'%27+imgsrc+%27');

这是我设计并实现的多文件上传功能，这些UI设计应该对你有帮助，以及这是一些使用关于Yii SWFUpload多文件上传的常见问题.

Yii 如何使用Swfupload和tinymce将多个上传图片插入到文章细节和步骤_Yii

 

Yii 如何使用Swfupload和tinymce将多个上传图片插入到文章细节和步骤_Swfupload_02


Yii 如何使用Swfupload和tinymce将多个上传图片插入到文章细节和步骤_休闲_03

 

文章必须以超链接形式标明文章原始出处和作者信息及版权声明,否则必将追究法律责任.作者: darwinwen | 出自: IT快讯网 | 原文地址: http://www.itkuaixun.com/post/48.htm