`

xheditor个人编辑器

    博客分类:
  • php
阅读更多
.先去xheditor的官方网站下载压缩文件,网址:http://xheditor.com/
2.根据你自己的路径,在你的Html文件上面加入:
Html代码
<link rel="stylesheet" href="css/common.css" type="text/css" media="screen" />
<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="js/xheditor-zh-cn.min.js?v=1.0.0-final"></script>

3.建立一个textarea,给他取一个id.
4.导入这一段。记住。$('#elem1').一定要和textarea的id一样,
Html代码
<script type="text/javascript">
$(pageInit);
function pageInit(){
$('#elem1').xheditor({skin:'vista',upImgUrl:upload.jsp'});
}
</script>

5.这样。几个简单的在线编辑器就好了,非常实用。美观度也不错。皮肤,按钮什么。需要什么可以自行修改。具体修改方法请参考你下载的压缩包。里面有非常详细的例子程序。
6.再这里最后强调一下,css文件的导入。记住。他需要2个css文件。iframe.css和ui.css还有一个common.css.他们的路径位置是有关联的、结构目录请参考我附件下面的图片。已经

Html代码
<!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>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>xhEditor demo4 : </title>
<link rel="stylesheet" href="http://localhost:8080/TMS/css/common.css" type="text/css" media="screen" />
<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="js/xheditor-zh-cn.min.js?v=1.0.0-final"></script>
<script type="text/javascript">
$(pageInit);
function pageInit(){
$('#elem1').xheditor({skin:'vista',upImgUrl:'http://localhost:8080/TMS/Resource_upload'});
}
</script>
</head>
<body>
<textarea id="elem1" name="elm1" rows="8" cols="80" style="width: 80%">
</textarea>
</body>
</html>
http://xinwenmm.co.cc
分享到:
评论

相关推荐

    xhEditor在线编辑器完整实例

    3. **xhEditor在线编辑器.suo**: 这是Visual Studio的用户选项文件,存储了个人用户设置,如断点、窗口布局等。这些信息不会影响编辑器的核心功能,但对开发环境的个性化有帮助。 4. **_ReSharper.xhEditor在线编辑...

    xheditor 文本编辑器插件

    这些编辑器各有特色,开发者可以根据项目需求和个人喜好选择合适的工具。 总结,xheditor作为一款老牌的JavaScript文本编辑器插件,以其丰富的功能和易用性在Web开发中占据一席之地。尽管如今有更多新的编辑器出现...

    xheditor-1.2.2.zip

    《XHEditor 1.2.2:一款强大的富文本编辑器详解》 在Web开发领域,富文本编辑器是不可或缺的一部分,它为用户提供了在网页上编辑、格式化文字的功能,极大地提升了交互体验。XHEditor是一款广受欢迎的开源...

    xheditor 源代码

    《深入解析xheditor:基于jQuery的JavaScript编辑器》 xheditor是一款广泛使用的JavaScript编辑器,基于强大的jQuery库构建,旨在提供一个易用、功能丰富的文本编辑解决方案。这款开源编辑器以其高度可定制性和易...

    xheditor1.1.14

    《XHEditor1.1.14:便捷的富文本编辑器详解》 在Web开发领域,一个优秀的编辑器是必不可少的工具,它能够帮助用户方便地创建和编辑包含文本、图片等多种媒体内容的网页。XHEditor1.1.14就是这样一款强大的富文本...

    xhEditor技术手册.CHM

    xhEditor是基于jquery国产的轻量级在线可视化HTML编辑器,个人觉得比ckeditor和ckfinder好用,并且效果绚丽。但是目前只有官方的在线技术文档,不方便学习和收藏,今天花了点时间做成了chm的格式,学习和翻阅方便点...

    HomeFounder beta2.zip

    在xhEditor编辑器下增加了文章可插入图片Ajax上传功能 留言板改善 插件使用情况: 使用了smarty模板引擎 使用了xhEditor文本编辑器 集成了百度分享 在此对所有插件开发者表示感谢 升级指南:无升级指南 安装...

    HomeFounder beta2

    HomeFounder是一套完全开放源代码的个人博客信息发布、展示平台,简称HF,同样地,HomeFounder并不局限于此,也是一...在xhEditor编辑器下增加了文章可插入图片Ajax上传功能 留言板改善 插件使用情况: 使用了s

    dokuwiki 插件.zip

    XHEditor_downcc.zip可能是XHEditor的一个分发版本,XHEditor是一款强大的富文本编辑器,支持HTML5,常用于网页内容的编辑和发布。在DokuWiki环境中,XHEditor可以替换默认的文本编辑界面,提供更丰富的格式化选项,...

    dokuwiki.rar

    XHEditor是一款功能丰富的JavaScript富文本编辑器,支持多种格式的文本编辑,包括插入图片、表格、链接等。在DokuWiki中集成XHEditor,使得用户在编辑页面时,能够享受到类似Word的编辑体验,极大地提高了编辑效率和...

    dokuwiki2020-07-29Hogfather.zip

    其次,DokuWiki支持多种插件,其中“xheditor”是一款功能强大的富文本编辑器插件,它提供了一个可视化的编辑界面,使得非技术用户也能轻松编辑和格式化文档。在Hogfather版本中,xheditor可能已经进行了更新,提供...

    简洁phpcms文章发布系统完整版

    05.JS采用了国际上比较流行的Jquery框架,还有基于Jquery的XHEditor可视化编辑器。 06.支持基于Apache和IIS的路径优化功能,让您的网站面向搜索引擎而优化。 07.单页功能:制作类似关于我们和公司介绍只要添加数据就...

    野草内容管理系统WeedCMS v5.0 beta1 build 20101222.rar

    (前提需要支持rewrite模块支持) 05.[优化]去掉了单页的上级页面 06.[优化]后台管理模板功能 07.[优化]广告可以放在模板任意位置,采用标签方法调用 08.[优化]升级后台编辑器为XHeditor1.1.2 09.[优化]新增首页的...

    网站SEO文章伪原创在线生成网站源码

    4. xheditor:这可能是一个富文本编辑器,用于用户编辑和预览文章内容。 5. admin:这个目录可能包含了后台管理系统的文件,用于管理员登录、管理文章、设置参数等。 6. install:这个文件或目录通常用于网站的安装...

    自由架构博客

    9. `xhEditor`:这是一款常见的网页编辑器,用于用户在博客上撰写和编辑文章,提供丰富的文本格式化功能。 综上所述,这个“自由架构博客”可能是一个基于PHP和Apache构建的开源博客平台,具有自己的特色配置和设计...

    weedcms野草内容管理系统 v5.3.0

    05.JS采用了国际上比较流行的Jquery框架,还有基于Jquery的XHEditor可视化编辑器。06.支持基于Apache和IIS的路径优化功能,让您的网站面向搜索引擎而优化。07.单页功能:制作类似关于我们和公司介绍只要添加数据就...

Global site tag (gtag.js) - Google Analytics