FckEditorAPI未定义错误分析

在做一个项目，因为考虑到图片上传后，需要将图片插入Fckeditor中，实现此功能的方法也很简单。

 

1  function  insertToArticle(picUrl)
2  {
3       var  oEditor  =  FCKeditorAPI.GetInstance( " tbtext " );
4       if (oEditor.EditMode  ==  FCK_EDITMODE_WYSIWYG)
5      {      
6          oEditor.InsertHtml( " <img src=' "   +  picUrl  +   " ' alt='' /> " );
7      }

8 } 

其中，"tbtext"为Fckeditor的ID，只需输入图片的地址就可调用此方法；

 

然而，在图片上传的单击事件中，调用的方法如下：

1 
2  ClientScript.RegisterClientScriptBlock( this .GetType(),  "" ,  " <script>parent.insertToArticle(' "   +  cu.Source  +   " ');</script> " );

3  

 

其中，cu.Source是我一个图片上传组件中的一个属性，即是：图片的原始路径。

 

当调用时出就抛出"FckEditorAPI未定义"的错误；

 

呵呵，这也是一个低级错误啦；

 

因为JavaScript的执行是线性的，根据文档加载的先后顺序依次执行。

文档加载完毕之后，可以随意调用文档中有定义的任一函数；文档加载完毕之前，只能调用前面已经加载的函数。

 

 

像下面这个例子是会出错的！

 

throwError( ' hello, error! ' );
function  throwError(s){alert(s);}

 

因为下面的函数throwError还没有加载到，所以不能提前调用。解决的方法很简单，就是把函数放到调用的前面。

 

而 "FckEditorAPI未定义"的错误也是同样道理。

 

解决方法也很简单， 

      一是确保调用在函数定义之后；

      二是等待页面加载完之后调用。

 

      我自己则是用了后者，用了<iframe></iframe>！！

      

      当然，也可以用JQuery的形式，如：

      

        jQuery(function($){alert(load ready!);}