Web编程 订阅所有【Web编程】的日志

50507多功能编辑器使用随笔

编辑:admin 日期:2006-07-21

字体大小: 小 中 大
很久前就想把50507多功能编辑器整合到自己页面中，却屡屡出现问题，今天无意再看了一遍"动网HTML在线编辑器的调用方法和使用方法详解"，回头一想就想通了，下边是50507多功能编辑器index.asp源码：

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE> 50507_com多功能编辑器（仿动网），[翼动音乐网--翼动工作室，http://www.50507.com] </TITLE>
<META NAME="Generator" CONTENT="EditPlus">
<META NAME="Author" CONTENT="">
<META NAME="Keywords" CONTENT="">
<META NAME="Description" CONTENT="">
<SCRIPT LANGUAGE="JavaScript" src="Editor/Editor.js"></SCRIPT>
<SCRIPT LANGUAGE="JavaScript">
<!--
function CheckForm(obj){
    obj.content.value = getContent();
}
//-->
</SCRIPT>
<style>
.Hand_Off {
    BACKGROUND-COLOR: #FFFFFFF;
    Text-align: center;
}
.Hand_On {
    border : 1px solid #3169C6;
    background-color : #C6D3EF;
    Text-align: center;
    cursor: pointer;
    HEIGHT: 20px;
    WIDTH: 20px;
}
</style>
</HEAD>

<BODY>
<TABLE width="500" align="center">
<FORM METHOD=POST name="form1" ACTION="Show.asp?act=Add" onClick="return CheckForm(this);">
<TEXTAREA NAME="content" ROWS="1" COLS="1" style="display:none;"></TEXTAREA>
<TR>
    <TD>
    <TABLE>
    <TR>
        <TD>
            <select name="font_name" id="font_name" onChange="FontName(this.options[this.selectedIndex].value)">
            <option class="heading" selected>字体
            <option value="宋体">宋体
            <option value="黑体">黑体
            <option value="楷体_GB2312">楷体
            <option value="仿宋_GB2312">仿宋
            <option value="隶书">隶书
            <option value="幼圆">幼圆
            <option value="新宋体">新宋体
            <option value="细明体">细明体
            <option value="Arial">Arial
            <option value="Arial Black">Arial Black
            <option value="Arial Narrow">Arial Narrow
            <option value="Bradley Hand ITC">Bradley Hand ITC
            <option value="Brush Script    MT">Brush Script MT
            <option value="Century Gothic">Century Gothic
            <option value="Comic Sans MS">Comic Sans MS
            <option value="Courier">Courier
            <option value="Courier New">Courier New
            <option value="MS Sans Serif">MS Sans Serif
            <option value="Script">Script
            <option value="System">System
            <option value="Times New Roman">Times New Roman
            <option value="Viner Hand ITC">Viner Hand ITC
            <option value="Verdana">Verdana
            <option value="Wide Latin">Wide Latin
            <option value="Wingdings">Wingdings</option>
            </select>
        </TD>
        <TD>
            <select name="font_size" id="font_size" onChange="FontSize(this.options[this.selectedIndex].value)">
              <option value="1">字号</option>
              <option value="1">1</option>
              <option value="2">2</option>
              <option value="3">3</option>
              <option value="4">4</option>
              <option value="5">5</option>
              <option value="6">6</option>
              <option value="7">7</option>
            </select>
        </TD>
        <TD OnClick="FontColor()" this.className='Hand_Off'; onmouseover=this.className='Hand_On'; onmouseout=this.className='Hand_Off';><IMG SRC="Editor/images/fgcolor.gif" WIDTH="16" HEIGHT="16" BORDER="0" ALT="字体颜色"></TD>
        <TD OnClick="BackColor()" this.className='Hand_Off'; onmouseover=this.className='Hand_On'; onmouseout=this.className='Hand_Off';><IMG SRC="Editor/images/fbcolor.gif" WIDTH="16" HEIGHT="16" BORDER="0" ALT="背景颜色"></TD>
        <TD OnClick="bold()" this.className='Hand_Off'; onmouseover=this.className='Hand_On'; onmouseout=this.className='Hand_Off';><IMG SRC="Editor/images/bold.gif" WIDTH="16" HEIGHT="16" BORDER="0" ALT="加粗"></TD>
        <TD OnClick="italic()" this.className='Hand_Off'; onmouseover=this.className='Hand_On'; onmouseout=this.className='Hand_Off';><IMG SRC="Editor/images/italic.gif" WIDTH="16" HEIGHT="16" BORDER="0" ALT="倾斜"></TD>
        <TD OnClick="underline()" this.className='Hand_Off'; onmouseover=this.className='Hand_On'; onmouseout=this.className='Hand_Off';><IMG SRC="Editor/images/underline.gif" WIDTH="16" HEIGHT="16" BORDER="0" ALT="下划线"></TD>
        <TD OnClick="ralign('left')" this.className='Hand_Off'; onmouseover=this.className='Hand_On'; onmouseout=this.className='Hand_Off';><IMG SRC="Editor/images/aleft.gif" WIDTH="16" HEIGHT="16" BORDER="0" ALT="居左"></TD>
        <TD OnClick="ralign('center')" this.className='Hand_Off'; onmouseover=this.className='Hand_On'; onmouseout=this.className='Hand_Off';><IMG SRC="Editor/images/center.gif" WIDTH="16" HEIGHT="16" BORDER="0" ALT="居中"></TD>
        <TD OnClick="ralign('right')" this.className='Hand_Off'; onmouseover=this.className='Hand_On'; onmouseout=this.className='Hand_Off';><IMG SRC="Editor/images/aright.gif" WIDTH="16" HEIGHT="16" BORDER="0" ALT="居右"></TD>
        <TD OnClick="url()" this.className='Hand_Off'; onmouseover=this.className='Hand_On'; onmouseout=this.className='Hand_Off';><IMG SRC="Editor/images/wlink.gif" WIDTH="16" HEIGHT="16" BORDER="0" ALT="超级链接"></TD>
        <TD OnClick="unurl()" this.className='Hand_Off'; onmouseover=this.className='Hand_On'; onmouseout=this.className='Hand_Off';><IMG SRC="Editor/images/unlink.gif" WIDTH="16" HEIGHT="16" BORDER="0" ALT="取消链接"></TD>
        <TD OnClick="image()" this.className='Hand_Off'; onmouseover=this.className='Hand_On'; onmouseout=this.className='Hand_Off';><IMG SRC="Editor/images/img.gif" WIDTH="16" HEIGHT="16" BORDER="0" ALT="插入图片"></TD>
        <TD OnClick="flash()" this.className='Hand_Off'; onmouseover=this.className='Hand_On'; onmouseout=this.className='Hand_Off';><IMG SRC="Editor/images/swf.gif" WIDTH="16" HEIGHT="16" BORDER="0" ALT="插入Flash"></TD>
        <TD OnClick="wmv()" this.className='Hand_Off'; onmouseover=this.className='Hand_On'; onmouseout=this.className='Hand_Off';><IMG SRC="Editor/images/wmv.gif" WIDTH="16" HEIGHT="16" BORDER="0" ALT="插入Windows Media"></TD>
        <TD OnClick="rm()" this.className='Hand_Off'; onmouseover=this.className='Hand_On'; onmouseout=this.className='Hand_Off';><IMG SRC="Editor/images/rm.gif" WIDTH="16" HEIGHT="16" BORDER="0" ALT="插入Real Media"></TD>
        <TD OnClick="unformat()" this.className='Hand_Off';ondrag='return false;'" onmouseover=this.className='Hand_On'; onmouseout=this.className='Hand_Off';><IMG SRC="Editor/images/cleancode.gif" WIDTH="16" HEIGHT="16" BORDER="0" ALT="取消格式"></TD>
    </TR>
    </TABLE>
    </TD>
</TR>
<TR>
    <TD>
<SCRIPT LANGUAGE="JavaScript">
<!--
    Editor(document.form1.content.value);
//-->
</SCRIPT>
    </TD>
</TR>
<TR>
    <TD><INPUT TYPE="submit" value="提交"></TD>
</TR>
</FORM>
</TABLE>
</BODY>
</HTML>

主要就在于红色部分代码，其原理是在提交表单时先将我们编辑的内容转到textarea中再提交，别误会，我们在页面中实际输入区域可不是textarea哦(PS:眼见未必为实，这下知道了吧)，知道这个原理，那textarea放在哪都无所谓了，关键是得把它给隐藏好，因而给他加了style="display:none;"。

上一篇: 游戏编程入门
下一篇: 主流网摘JS
文章来自: 本站原创
引用通告: 查看所有引用 | 我要引用此文章
Tags:
最新日志:
评论: 2 | 引用: 0 | 查看次数: 6866
dnawo[2007-09-14 08:36 AM | | | 59.56.4.7 | del | 回复回复]
板凳
服务器端用Request("content")获取内容，保存至数据库即可
什么符号会无法进数据库？不解
sasha[2007-09-13 02:21 PM | | | 222.210.104.87 | del | 回复回复]
沙发
不错的文章，比较实用。
但如何把输入的内容保存至数据库中呢，因为内容中有部分符号无法进入数据库。
发表评论
请登录后再发表评论！