jme芦苇
论坛版主
论坛版主
  • UID2
  • 粉丝66
  • 关注8
  • 发帖数120
  • 社区居民
  • 阅读:59454
  • 回复:58

JMEditor安装使用教程(V0.9.2)

楼主#
更多 发布于:2013-02-08 15:01

一、 下载最新的JMEditor(http://www.jmeditor.com)。


二、 目录结构
解压下载的文件,得到以下目录
JMEditor-x
├ jmeditor
│ ├ ckeditor
│ │ └ 。。。
│ └ mathquill-x
│   └ 。。。
├ style
│ └ default.css
├ index.html
└ view.html
其中,jmeditor目录为编辑器的主目录;index.html、view.html和style目录是Demo相关的文件。
没有特殊说明时,版本更新时,只需要覆盖jmeditor目录即可。


三、 使用步骤
1. 复制jmeditor目录到应用根目录,如D:/webroot/jmeditor。


2. 编辑需要引用编辑器的页面


(1). 指定HTML文档的渲染模式,在head中间加入以下指令:
<meta http-equiv="X-UA-Compatible" content="chrome=1" />
(2). 引入jquery和编辑器js,在head中间加入以下引用:
<script type="text/javascript" src="jmeditor/jquery-1.8.3.min.js"></script>
<script type="text/javascript" src="jmeditor/JMEditor.js"></script>
(3). 定义编辑区域,如下
<div contentEditable="true"></div>
至此,就完成了JMEditor的安装。
(4). 为了让编辑区看上去更美观,添加样式class=”editDemo”。为了容易取到编辑的内容添加id="content"。如下所示:
<div id="content" contentEditable="true" class="editDemo"></div>


如果您还有其他问题,请给我们留言。

喜欢20
jme芦苇
论坛版主
论坛版主
  • UID2
  • 粉丝66
  • 关注8
  • 发帖数120
  • 社区居民
沙发#
发布于:2013-02-17 20:22
smith:还是不懂回到原帖
具体哪里不明白?
jme芦苇
论坛版主
论坛版主
  • UID2
  • 粉丝66
  • 关注8
  • 发帖数120
  • 社区居民
板凳#
发布于:2013-02-18 19:03
yang_dongxin:3.       定义编辑区域,如下
  


编辑区域能不能在js代码中手动指定,而不是通过contenteditable="true"?
回到原帖
setTimeout(function(){
    JMEditor.ckEditor.disableAutoInline = true;//禁用自动渲染
    var editor = JMEditor.ckEditor.inline( 'content' );//渲染id='content'的div
    document.getElementById("content").contentEditable = true;//可编辑
});
jme芦苇
论坛版主
论坛版主
  • UID2
  • 粉丝66
  • 关注8
  • 发帖数120
  • 社区居民
地板#
发布于:2013-02-18 19:07
补充一下:JMEditor集成了ckEditor,通过JMEditor.ckEditor即可得到CKEDITOR对象,其原有的API完全可用。
jme芦苇
论坛版主
论坛版主
  • UID2
  • 粉丝66
  • 关注8
  • 发帖数120
  • 社区居民
4楼#
发布于:2013-02-19 21:00
yang_dongxin:CKEDITOR.replace('quizContent',{'config.filebrowserUploadUrl' :'ckeditor.upload.do'});
我用这种方式生成编辑器的,但生成公式后点完“确定”,在ckedi...
回到原帖
我按这个方式加载后,打开公式编辑器时有脚本错误,且不显示常用公式。目前仅支持inline方式,您看能不能试着调整一下。
jme芦苇
论坛版主
论坛版主
  • UID2
  • 粉丝66
  • 关注8
  • 发帖数120
  • 社区居民
5楼#
发布于:2013-02-19 21:02
yang_dongxin:楼主能不能建个qq群,等回帖太慢了回到原帖
现阶段我们都是兼职在做这个,即使建QQ群,也做不到随时解答,希望您能理解!
jme芦苇
论坛版主
论坛版主
  • UID2
  • 粉丝66
  • 关注8
  • 发帖数120
  • 社区居民
6楼#
发布于:2013-02-19 21:28
174751964:在一个页面中需要多处用到公式编辑器,如何修改呢(需要给jme.js传个ID进去)回到原帖
是有这个问题,线上的已经修改了。
您下载线上的文件http://www.jmeditor.com/jme/jmeditor/ckeditor/plugins/jme/dialogs/jme.js,覆盖一下试试。
jme芦苇
论坛版主
论坛版主
  • UID2
  • 粉丝66
  • 关注8
  • 发帖数120
  • 社区居民
7楼#
发布于:2013-04-04 08:42
侧面不错

老大你好,只复制jmeditor文件夹就可以了吗?style​这个文件夹不用复制吗?回到原帖

不用,只要保持您原页面的样式就可以。
jme芦苇
论坛版主
论坛版主
  • UID2
  • 粉丝66
  • 关注8
  • 发帖数120
  • 社区居民
8楼#
发布于:2013-04-10 08:52
zj2050

这个能作为ckeditor的插件一样安装么? 而不是用这个来集成ckeditor

回到原帖
本身就是 CKEditor的插件
jme芦苇
论坛版主
论坛版主
  • UID2
  • 粉丝66
  • 关注8
  • 发帖数120
  • 社区居民
9楼#
发布于:2013-04-17 21:24
athrua:如果一开始我把 content  div隐藏,点击按钮事件后再显示, JMEditor会是灰的,不能点,这个应该怎么弄呢?回到原帖

网站上提供的例子就是先隐藏,再显示的,没有问题。


我把例子改了一下,隐藏content的div,也没有问题。


 <input type="button" value="show" onclick="$('#content').show();">
     <p>
      <div id="content" contentEditable="true" class="editDemo" style="display:none">
       
      </div>
     </p>


不知道您是什么情况?可以把代码贴出来看看。

jme芦苇
论坛版主
论坛版主
  • UID2
  • 粉丝66
  • 关注8
  • 发帖数120
  • 社区居民
10楼#
发布于:2013-04-18 22:58

首先取消自动转换
<script type="text/javascript">
 setTimeout(function(){
  JMEditor.ckEditor.disableAutoInline = true;
 });
</script>


等div显示后,再用js转换成编辑器


<input type="button" value="show" onclick="$('#content').show();JMEditor.ckEditor.inline( document.getElementById( 'content' ) );">
<div id="content" class="editDemo" contentEditable="true" style="display:none;">
</div>

jme芦苇
论坛版主
论坛版主
  • UID2
  • 粉丝66
  • 关注8
  • 发帖数120
  • 社区居民
11楼#
发布于:2013-04-19 12:20

编辑区的id="content",搞对了吗?

jme芦苇
论坛版主
论坛版主
  • UID2
  • 粉丝66
  • 关注8
  • 发帖数120
  • 社区居民
12楼#
发布于:2013-05-13 08:48
wudy516865531

lz,这个只有在chrome上用吗,在IE9上打开公式编辑器,编辑完了之后点确定没有反应,在chrome上可以正行编辑

回到原帖
IE9有问题,后续更新版本会解决
jme芦苇
论坛版主
论坛版主
  • UID2
  • 粉丝66
  • 关注8
  • 发帖数120
  • 社区居民
13楼#
发布于:2013-11-27 16:29
zhanghuaizhu:老大!我编辑完公式点击确定的时候没有反应是怎么回事回到原帖
换浏览器试试,可以是兼容问题

返回顶部