wangEditor支持使用`sea.js`进行模块定义,通过一个demo演示一下。
-----
demo的源码结构是这样的:
![](https://box.kancloud.cn/2016-02-24_56cdbb8ed4651.png)
首先,在`js`文件夹中引用`jquery`,**特别注意——jquery默认是不支持CMD的,必须对源码做出调整。调整内容功能如下:**
```js
//调整前:
if ( typeof define === "function" && define.amd ) {
define( "jquery", [], function() {
return jQuery;
});
}
//调整后:
if ( typeof define === "function") {
define( "jquery", [], function() {
return jQuery;
});
}
```
因此,调整后的名字修改为`jquery-2.2.1-for-seajs.js`。然后在`js`文件夹中引用`sea.js`
然后,创建一个`main.js`,将作为启动项在html页面中引用。代码如下:
```js
define(function(require, exports, module){
var $ = require('jquery');
require('wangEditor')($);
$(function(){
// 用来创建编辑器
var editor = new wangEditor('div1');
editor.create();
});
});
```
最后,创建一个html文件,**html文件和`main.js`最好在同一个目录下**。其中引用`seajs`:
```html
<div id="div1">
<p>请输入内容...</p>
</div>
<!--引用seajs-->
<script type="text/javascript" src="sea.js"></script>
<script type="text/javascript">
// seajs 的简单配置
seajs.config({
alias: {
// 相对于 main.js 的路径
'jquery': './js/jquery-2.2.1-for-seajs',
'wangEditor': '../../dist/js/wangEditor.min'
}
});
// 加载入口模块,即刚刚创建的 main.js
seajs.use("main");
</script>
```
搞定!
---
PS:demo源码请参见 https://github.com/wangfupeng1988/wangEditor/tree/master/test/seajs
----
**注意,使用一个浏览器同时浏览requirejs和seajs的demo,可能出现混乱。这两种情况本来就不可共存,浏览demo时也请使用不同浏览器查看效果。**
- 关于wangEditor
- 遇到问题如何解决和提问【重要】
- 开始使用
- 下载
- 创建页面
- 生成编辑器(使用ID)
- 生成编辑器(使用element)
- 调整尺寸
- 销毁与恢复
- 一个页面多个编辑器
- 内容处理
- 初始化内容
- 获取内容
- 追加内容
- 清空内容
- 用 editor.$txt 做其他内容处理
- onchange事件
- 禁用/启用
- 参数配置
- 自定义菜单
- 自定义颜色、字体、字号
- 自定义表情
- 切换语言
- 百度地图key
- 菜单栏吸顶
- 配置全屏的z-index
- 关闭浏览器打印log
- 关闭过滤javascript
- 关闭粘贴过滤样式
- 只粘贴纯文本
- 插入代码-配置默认语言
- 自定义编辑器样式
- 自定义颜色
- 自定义菜单UI
- 自定义表格、引用、代码的样式
- 代码高亮样式
- 图片上传
- 使用前必读
- 支持情况
- 配置说明
- log提示辅助排错
- 后台代码示例
- C#
- java - 例1
- java - 例2
- php
- nodejs
- python
- 自定义上传事件
- 集成plupload插件
- 集成七牛云存储
- 跨域上传
- 上传图片出错时的解决步骤
- 使用模块定义
- 使用require.js
- 使用seajs
- 使用webpack
- 插件开发
- 对象结构
- 常用API
- 全局API
- 对象API
- 基础API
- 选区API
- 命令API
- 扩展一个菜单
- 『缩进』菜单
- 『行高』菜单
- 『插入符号』菜单
- 开发一个插件
- 常见问题
- 关于markdown
- 关于上传附件
- 关于背景图片
- 关于显示压缩图片
- 集成到React
- 集成到angular
- 集成到vue.js
- 如何避免与项目中的css冲突
- xss过滤
- 如何插入视频链接
- 关于mobile端编辑器
- 查看源码第一行有空格