`

fckeditor的使用

    博客分类：
  • j2ee
fckeditorJavaScriptPHPHTMLXHTML 
阅读更多

先根据上一篇博文下载FckEditor的工具

1.简单的例子

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
 <title>ckeditor</title>
 <meta content="text/html; charset=utf-8" http-equiv="content-type" />
 <script type="text/javascript" src="ckeditor/ckeditor.js"></script>
 
</head>
<body>
 
 <form action="sample_posteddata.php" method="post">
  <p>
  
   <textarea class="ckeditor" cols="80" id="editor1" name="editor1" rows="10"></textarea>
  </p>
  <p>
   <input type="submit" value="Submit" />
  </p>
 </form>
 
</body>
</html>

 

2.可以改变语言的例子

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
 <title>CKEditor Sample</title>
 <meta content="text/html; charset=utf-8" http-equiv="content-type" />
 <script type="text/javascript" src="ckeditor/ckeditor.js"></script>
 <script type="text/javascript" src="ckeditor/lang/_languages.js"></script>
</head>
<body>
 <div id="alerts">
  <noscript>
   <p>
    <strong>CKEditor requires JavaScript to run</strong>. In a browser with no JavaScript
    support, like yours, you should still see the contents (HTML data) and you should
    be able to edit it normally, without a rich editor interface.
   </p>
  </noscript>
 </div>
 <form action="sample_posteddata.php" method="post">
  <p>
   <label for="editor1">
    改变语言 (<span id="count"> </span>种语言):</label><br />
    <script type="text/javascript">
    //<![CDATA[
     document.write( '<select disabled="disabled" id="languages" onchange="createEditor(this.value);">' );
     //从文件 _languages.js中获取语言类别.
     for ( var i = 0 ; i < window.CKEDITOR_LANGS.length ; i++ )
     {
      document.write(
       '<option value="' + window.CKEDITOR_LANGS[i].code + '">' +
        window.CKEDITOR_LANGS[i].name +
       '</option>' );
     }
     document.write( '</select>' );
    //]]>
    </script>
   <br />
   <span style="color: #888888">(如果你的系统你支持你所选择的语言，可能会出现奇怪的字体)</span>
  </p>
  <p>
   <textarea  cols="80" id="editor1" name="editor1" rows="10"></textarea>
   <script type="text/javascript">
   //<![CDATA[
    // 设置语言的种类.
    document.getElementByIdx( 'count' ).innerHTML = window.CKEDITOR_LANGS.length;
    var editor;
    function createEditor(languageCode)
    {
     if (editor)
      editor.destroy();
     // 替换标签<textarea id="editor"> 用该设置的语言
     editor = CKEDITOR.replace( 'editor1',
      {
       language : languageCode,
       on :
       {
        instanceReady : function()
        {
            var languages = document.getElementByIdx( 'languages' );
         languages.value = this.langCode;
         languages.disabled = false;
        }
       }
      } );
    }
    // 页面第一次加载时，加载默认的语言对应得编辑器
    createEditor( '' );
   //]]>
   </script>
  </p>
 </form>
</body>
</html>

 

 

来自：http://blog.sina.com.cn/s/blog_6145ed810100hcef.html

分享到：
| 网页在线编辑器 fckeditor
评论
发表评论

您还没有登录,请您登录后再发表评论

相关推荐

Magicbox
Global site tag (gtag.js) - Google Analytics