当前位置: 首页 > 图文教程 > 网络编程 > 网页编辑器 > xhEditor的异步载入实现代码

网页编辑器
让 FCKeditor 支持多用户Web环境(以PHP为例)
Ewebeditor 文件上传问题
PHP网页 Ewebeditor 编辑器嵌入方法
FckEditor 上传图片后图片变小了！问题解决
fckeditor asp版本的文件重命名
FckEditor 中文配置手册
FCKEditor网页编辑器 几点使用心得
FCK 编辑器焦点问题
添加FCKeditor插件需要注意的地方
javascript 获取FCKeditor内容
eWebEditor 上传文件提示格式不正确的解决方法
xhEditor的异步载入实现代码
FCKeditor 编辑器插入代码功能实现步骤
配置fckeditor 实现图片的上传
FCKeditor提供了一个完整的JavaScript API
fckediter javascript事件函数代码
ASP FCKeditor在线编辑器使用方法
ASP下使用FCKeditor在线编辑器的方法
ASP.NET中FCKEDITOR在线编辑器的用法
php下FCKeditor2.6.5网页编辑器的使用方法

No. « 1 2 3 4 »

技术文章搜索

关键字

网页编辑器 中的 xhEditor的异步载入实现代码

出处:互联网   整理: 软晨网（RuanChen.com）   发布: 2010-01-10   浏览: 57 ::
收藏到网摘: n/a

xhEditor的异步载入实现代码，需要的朋友可以参考下。

我将会使用xheditor作为新的在线编辑器，我希望它可以能通过一个php函数就能调用如

复制代码 代码如下:

function editor($content,$name)
{
$editor=<<<EOT
<textarea id="$name" name="$name" rows="10" cols="60">$content</textarea>
EOT;
return $editor;
}

这样做的好处有：
1,不用每次调用xheditor编辑器，都在前面写一大
2,调用方便，模板上就放返回的html代码的变量就可以了。

我使用的方法是用jquery里的get()方法异步xheditor的代码，然后再用eval把代码运行了。
如下:

复制代码 代码如下:

function editor($content,$name)
{
$editor=<<<EOT
$(document).ready(
function(){
if(!$.isFunction($.xheditor))
{
$.get(
'../xheditor.js',
function(data){
eval(data);
}
);
}
$('#{$name}').xheditor(true);
}
);
<textarea id="$name" name="$name" rows="10" cols="60">$content</textarea>
EOT;
return $editor;
}

以上代码正确情况下，你是运行不了。
因为xheditor的0.9.8版在异步载入时会出现问题。导致xheditor不能正常显示。
原因：
由于jsURL是通过获取页面的来得到的。但我是采用异步加载的，所以我需要指定jsURL的地址。

补丁：
打开xheditor.js找到以下代码

复制代码 代码如下:

var defaults={skin:"default",tools:"full",internalScript:false,inlineScript:false,internalStyle:false,inlineStyle:true,showBlocktag:false,forcePtag:true,keepValue:true,upLinkExt:"zip,rar,txt",upImgExt:"jpg,jpeg,gif,png",upFlashExt:"swf",upMediaExt:"avi",modalWidth:350,modalHeight:220,modalTitle:true};


改为
复制代码 代码如下:

var defaults={skin:"default",tools:"full",internalScript:false,inlineScript:false,internalStyle:false,inlineStyle:true,showBlocktag:false,forcePtag:true,keepValue:true,upLinkExt:"zip,rar,txt",upImgExt:"jpg,jpeg,gif,png",upFlashExt:"swf",upMediaExt:"avi",modalWidth:350,modalHeight:220,modalTitle:true,editorURL:null};

其实就是增加了editorURL的默认值
然后再找到

复制代码 代码如下:

this.settings=$.extend({},defaults,options);

在其后面添加
复制代码 代码如下:

jsURL= this.settings.editorURL||jsURL;

用于设置jsURL是使用默认值还是用户自定义的目录