Chinaunix首页 | 论坛 | 博客
  • 博客访问: 17713535
  • 博文数量: 7460
  • 博客积分: 10434
  • 博客等级: 上将
  • 技术积分: 78178
  • 用 户 组: 普通用户
  • 注册时间: 2008-03-02 22:54
文章分类

全部博文(7460)

文章存档

2011年(1)

2009年(669)

2008年(6790)

分类:

2008-04-13 20:54:26

首先介绍如何用javascript创建fckeditor

//--------------------------------------------------------------------------------------------------

第一在头部有个引用:

CODE:
<script type="text/javascript" src="/FCKeditor/fckeditor.js"></script>
加入创建代码(创建的代码有多种形式)
第一种创建模式: 直接创建


CODE:
<script type="text/javascript">
var oFCKeditor = new FCKeditor('FCKeditor1');
oFCKeditor.BasePath = "/FCKeditor/";
oFCKeditor.Create();
</script>
第二种创建模式: 替换textarea

CODE:
<script type="text/javascript">
window.onload = function()
{
var oFCKeditor = new FCKeditor( 'MyTextarea' ) ;
oFCKeditor.BasePath = "/FCKeditor/" ;
oFCKeditor.ReplaceTextarea() ;
}
</script>
<textarea id="MyTextarea" name="MyTextarea">This is <b>the</b> initial value.</textarea>
在对于替换多个textArea时可以使用如下方法

CODE:
<html>
<head>
<title>Testing ReplaceAll()</title>

<script type="text/javascript" src="/FCKeditor/fckeditor.js"></script>

<script type="text/javascript">
<!--
function ReplaceAllTextareas() {
// replace all of the textareas
var allTextAreas = document.getElementsByTagName("textarea");
for (var i=0; i < allTextAreas.length; i++) {
var oFCKeditor = new FCKeditor( allTextAreas.name ) ;
oFCKeditor.BasePath = "/FCKeditor/" ;
oFCKeditor.ReplaceTextarea() ;
}
}
// -->
</script>

</head>

<body onLoad="javascript: ReplaceAllTextareas()">

<form>
<input type="checkbox" name="bobby" /> bobby <br />
<input type="checkbox" name="sue" /> sue <br />

Summary:
<textarea name="summary" rows="4" cols="80"> here is the summary </textarea>
Overview:
<textarea name="overview" rows="10" cols="80"> here is the overview </textarea>
Detials:
<textarea name="details" rows="60" cols="80"> here are teh details </textarea>

<input type="submit" name="sue" /> <br />
<input />
</form>

</body>
</html>
方法说明:

oFCKeditor.Width = 400 ; // 400 pixels

oFCKeditor.Width = "80%" ; // 80 percent

oFCKeditor.Height = 400 ; // 400 pixels

oFCKeditor.ToolbarSet = "MyToolbar" ;

oFCKeditor.Value = "<h1>Testing</h1>This is a <b>sample</b>." ;

oFCKeditor.BasePath = "/Components/FCKeditor/" ;

oFCKeditor.CheckBrowser = true ; //检查浏览器兼容性

oFCKeditor.DisplayErrors = false ; //转义editor显示错误信息


结合ajax使用fckeditor

//--------------------------------------------------------------------------------------------------


应用于ajax的时候可以考虑通过自带的例子sample08.html里面的函数GetContents结合使用

CODE:
function GetContents(fck)
{
        // Get the editor instance that we want to interact with.
        var oEditor = FCKeditorAPI.GetInstance(fck) ;

        // Get the editor contents in XHTML.
        return oEditor.GetXHTML( true )  ;                // "true" 表示执行格式化
}
url处理:

CODE:
fckeditor_value="fckeditor_value="+encodeURIComponent(GetContents("MyFCKeditor"))?//通过encodeURIComponent的javascript函数处理掉传参数里面出现各种不符字符

获取fckeditor里面的参数

提交:(这里使用的是prototype)


CODE:
new Ajax.Request("magsee.php",{method: 'post',parameters:fckeditor_value,onComplete:success_vote});
结果的获取magsee.php

CODE:
$_POST['fckeditor_value']
阅读(241) | 评论(0) | 转发(0) |
给主人留下些什么吧!~~