bkLib
:
这个是BK写的一些很实用的函数了,看看里面的函数好像只有一个不常见,
camelize
这个是
驼峰风格
的字符串转换函数,看看他的规则很简单,就是如果如果字符串里面出现
-
号,就把
- 删除,并把紧跟后面的字母替换为大写,
驼峰风格真是个形象的比喻.
使用这个函数的原因是DOM对象中有个
currentStyle,他对于样式属性的命名规则是
驼峰风格的,比如
background-color被写成backgroundColor,就是这样。
$BK
:
这个函数对象很有意思,看代码是根据ID返回一个DOM对象或者进一步把DOM对象扩展为 bkElement 对象。
这种写法叫什么呢?步进?我不知道.
Function closur
:
函数闭包,设计了两个函数,
closur,
closureListener
.
关于闭包的详细资料您可以自己去查查资料,不过这里的闭包作用是绑定触发对象,
前面我们看到
nicEdit有对事件Event进行自己的封装,她的事件是可以外部触发(代码触发)的,很明显通过外部触发的事件的触发者this,并不是我们期望的对象本身,而是外部触发的对象。因此需要把我们期望的对象绑定到触发事件,闭包在这起了作用。
我们接着看源代码发现,所有的addEvend实例代码都用闭包做为参数。呵呵我们使用的时候当他透明好了。除非你自己制作扩展,那一定要明白闭包的作用了。
__
:
这个函数目前太简单了,就是返回参数自身,看看__在源代码里的使用,好像传入的参数都是字符串,做什么用呢?I18N,国际化了。作者虽然没有给出另外lang的例子,不过我们知道I18N的接口已经留下了。
现在就让我们实做一个zh-CN的翻译吧。最简单的方法是什么呢?当然是直接把翻译写入__函数内部,不过这样就不是I18N,而是zh-CN了。
我们做个小小的扩展为nicEdit增加一个nicEditorI18N的对象使用起来就像下面代码的实例
if (nicEditorI18N==undefined) {
nicEditorI18N={};
}
nicEditorI18N['zh-CN'] = {
'Click to Bold' :'加黑',
'Click to Italic' :'倾斜',
'Click to Underline' :'下划线',
'Left Align' :'左对齐',
'Center Align' :'中间对齐',
'Right Align' :'右对齐',
'Insert Ordered List' :'有序列表',
'Insert Unordered List' :'无序列表',
'Select Font Size' :'字体大小',
'Select Font Family' :'字体样式',
'Select Font Format' :'字体格式',
'Click to Subscript' :'下标',
'Click to Superscript' :'上标',
'Click to Strike Through' :'删除线',
'Remove Indent' :'减少缩进量',
'Indent Text' :'增加缩进量',
'Horizontal Rule' :'水平线',
'Change Text Color' :'更改文字颜色',
'Change Background Color':'更改背景色',
'Add Image' :'添加图片',
'Edit HTML' :'编辑 HTML',
'Add Link' :'添加链接',
'Remove Link':'移除链接'
};
可以把它存储为zh-CN.js,在调入nicEdit的其他js之前先调入他(也许是其他的语言),我们还需要表明所使用的语种
设定一个变量就行了。
var nicEditorLang='zh-CN';
最后我们改写__
var __=function(s){
if(nicEditorLang && nicEditorI18N)
return nicEditorI18N[nicEditorLang][s] || s;
else
return s;
}
你也许会问,怎么用
zh-CN
,不用
zh_cn
呢?
你当然可以用zh_cn了,我用zh-CN的目的很简单就是因为标准的语种定义应该在html标签里写上xml:lang="zh-CN"的,如果我们写的都这么标准的话,就不用定义nicEditorLang这个变量了,直接取这个xml:lang就行了。
路有很多条,反正是扩展嘛,要自己动手的怎么做看你的选择了。
分享到:
相关推荐
【 nicEdit 脚本实例详解 】 nicEdit 是一个轻量级的在线HTML编辑器,主要用于网页上提供便捷的富文本编辑功能。它旨在简化网页中的文本输入体验,让用户可以像在桌面文本编辑器中一样编辑内容,而无需深入学习复杂...
bkLib.onDomLoaded(function() { new nicEditor().panelInstance('myTextArea'); }); <textarea id="myTextArea"></textarea> ``` 这里,`new nicEditor().panelInstance('myTextArea')`会将ID为`myTextArea`的...
bkLib.onDomLoaded(function() { new nicEditor().panelInstance('yourTextareaId'); }); ``` 这里的`yourTextareaId`是你希望转化为富文本编辑器的textarea元素的ID。 3. **配置选项**: 可以通过传递一个配置...
"nicEdit"是一款轻量级但功能强大的在线文本编辑器,专为网页设计和内容创建者提供便捷的富文本编辑体验。它不占用大量系统资源,却能提供类似于桌面文字处理软件的功能,使得用户在网页上可以轻松进行格式化、插入...
bkLib.onDomLoaded(function() { new nicEditor().panelInstance('area1'); new nicEditor({fullPanel : true}).panelInstance('area2'); new nicEditor({iconsPath : '../nicEditorIcons.gif'}).panelInstance('...
**nicEdit**是一款轻量级的网页所见即所得(WYSIWYG)编辑器,它的特点是体积小巧,仅由一个JavaScript文件和一个图像文件组成。这种简洁的设计使得nicEdit在网页集成上非常便捷,无需复杂的配置和安装过程,极大地...
**nicEdit轻量级文本编辑器** nicEdit是一款小巧而功能强大的在线文本编辑器,它专为网页开发者设计,主要用于在网页上提供便捷的富文本编辑功能。由于其体积小、加载速度快,使得它成为很多网站论坛、博客和其他...
### NicEdit编辑器API文档知识点概述 #### 一、关于NicEdit NicEdit是一款轻量级、跨平台的内联内容编辑器,旨在使网站内容能够轻松地在浏览器中进行即时编辑。它的小巧易用使得任何网页元素或div都可以变成可编辑...
** NicEdit:基于AJAX技术的WYSIWYG在线编辑器 ** NicEdit是一款轻量级、高效的富文本编辑器,它利用AJAX技术实现了无刷新的“所见即所得”(WYSIWYG)编辑功能。在网页设计中,这种编辑器允许用户在浏览器上直接...
1. **JavaScript库**:nicEdit是基于JavaScript编程语言构建的,这意味着它可以在客户端运行,无需服务器端支持。JavaScript库通常用于增强网页交互性,提供动态效果和功能。 2. **富文本编辑**:nicEdit提供了富...
bkLib.onDomLoaded(function() { new nicEditor().panelInstance('yourTextareaId'); }); ``` 这段代码会在页面加载完成后,将ID为`yourTextareaId`的textarea转换为NicEdit富文本编辑器。 五、定制和扩展...
在这个专题中,我们将深入探讨NicEdit的基本功能、优点、如何使用以及其在实际项目中的应用。 首先,让我们了解NicEdit的核心特性。NicEdit是一个Inline Content Editor,这意味着它可以直接嵌入到HTML元素中,使得...
**nicEdit 编辑器详解** 在Web开发中,富文本编辑器是不可或缺的一部分,它为用户提供了在网页上创建和编辑复杂格式文本的能力。nicEdit是一款轻量级且易于集成的富文本编辑器,特别适合那些对资源要求严格的项目。...
bkLib.onDomLoaded(function() { nicEditors.allTextAreas() }); ``` 这段代码会在页面加载完成后,将所有`<textarea>`元素替换为NicEdit编辑器。 总的来说,NicEdit作为一款优秀的富文本编辑器,以其轻巧、兼容...
NicEdit能够让任何 element/div变成可编辑或者能够把标准的TextArea转换成富文本编辑器。 NicEdit是我见过最轻量级的富文本编辑器,总共就一个JS文件和一张图片,经过我在项目里的使用情况来看,相当好用。
bkLib.onDomLoaded(function() { nicEditors.allTextAreas() // 将所有文本区域转换为nicEdit编辑器 }); ``` 如果你想针对特定的元素启用nicEdit,可以这样写: ```javascript var nicEditorInstance = new ...
nicEdit 是一款简洁的HTML网页在线编辑器,上传功能需要自己添加,nicEdit除了上传功能外,几乎包括了常用的网页文字编辑功能,包括排版、字体样式设计、表格插入、图片插入等,若对编辑器上传功能无要求的话,...
**nicEdit:小巧而强大的网页文本编辑器** nicEdit是一款轻量级的JavaScript富文本编辑器,它以其简洁的设计和全面的功能集而受到广大Web开发者的喜爱。在网页设计和内容管理系统(CMS)中,富文本编辑器是必不可少...
在使用 nicEdit 时,你需要在页面中引入这个文件,并调用 `bkLib.onDomLoaded(nicSetup);` 来启动编辑器。如果要启用图片上传,还需要额外的配置,例如设置图片上传的 URL 为 `upload.php`。 `demo.html` 是一个...
《NicEdit:一款轻量级的前端富文本编辑器》 在前端开发中,富文本编辑器是一个不可或缺的工具,它允许用户以类似Word的方式在网页上编辑内容。NicEdit是一款小巧而强大的富文本编辑器,它以简洁的API、易用性和...