您的位置：首页 > Web前端 > HTML

一个小巧的HTML编辑器_CLEditor_源码下载

2012-11-09 15:07 197 查看
官网：
　　http://premiumsoftware.net/cleditor/
　　


关于CLEditor:
　　CLEditor是一个开源的jQuery插件提供了一个轻量级的、全功能、跨浏览器、可扩展、
　　WYSIWYG HTML编辑器,可以很容易地添加到任何网站。
轻量级插件：

　　CLEditor消耗小于9 k的总带宽.包括的文件如下：



特性：

　　除了标准的文本格式化特性发现在其他的所见即所得编辑器,CLEditor也含有丰富的下降对
　　字体名称、大小起伏、风格、文本颜色和突出颜色。CLEditor允许您插入图片,超链接和水平的规则。
跨浏览器：
　　CLEditor支持以下浏览器都在pc和mac:IE 6.0 + 1.5 +,Safari 4 FF +、Chrome和Opera 10 + 5 +。
　　所有的测试都是使用jQuery 1.4.2。

=============================================================
说了这么多，现在就上一个例子：
1.项目结构



2.效果：



3./CLEditor/WebContent/index.jsp

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<link rel="stylesheet" type="text/css" href="CLEditor1_3_0/jquery.cleditor.css" />
<script type="text/javascript" src="CLEditor1_3_0/jquery.min.js"></script>
<script type="text/javascript" src="CLEditor1_3_0/jquery.cleditor.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$("#input").cleditor();
$("#sub").click(function(){
var input = $("#input").val();
$("#show_mess").html(input);
});
});
</script>
</head>

<body>
About CLEditor<br>
<a href="http://premiumsoftware.net/cleditor/">CLEditor</a> is an open source jQuery plugin which provides a lightweight<br>
full featured, cross browser, extensible, WYSIWYG HTML editor that can be easily added into any web site.<br>
<textarea id="input" name="input"></textarea><br>
<button id="sub">submit</button>
<hr>
<div id="show_mess"></div>
</body>
</html>


源码下载：http://files.cnblogs.com/hongten/CLEditor.rar
内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理 点击这里给我发消息
标签： 
相关文章推荐
新的分享
章节导航