jQuery,编辑器插件

学习要点:

  1.编辑器简介

  2.引入 uEditor

编辑器(Editor),一般用于类似于 word 一样的文本编辑器,只不过是编辑为 HTML 格式的。分类纯 JS 类型的,还有 jQuery 插件类型的。

一.编辑器简介

我们使用的 jQuery 版本比较新,但尚未全面使用 2.0 的版本,因为 IE6,7,8 被抛弃了。 而恰恰在这个时期,就出现编辑器插件的两极分化的局面。高端和先进的 HTML 编辑器已 经全面不支持 IE6,7,8 了,而老版本的 HTML 编辑器,在使用 jQuery1.10.x 版本时会发生这 样那样的不兼容。为此,还需要引入 jquery-migrate-1.2.1.js 向下兼容插件才能解决一部分问 题。并且需要手动修改源代码保证了正常运行。

二.引入 uEditor

  第一步:引入 jquery-migrate-1.2.1.js 文件,排除编辑器低版本的问题。

  第二步:把编辑器文件夹包放入根目录下。

  第三步:引入 uEditor.js 和 uEditor.css 两个文件。 第四步:插入 textarea,设置规定值。 第五步:jQuery 调用运行。

插入 textarea,设置规定值

html

注意表单里的文本框<textarea>标签,必须class="uEditorCustom"

<textarea class="uEditorCustom" name="content">请填写问题描述!</textarea>

uEditor()方法,让一个<textarea>标签文本框,执行编辑器方法,一般在<textarea>标签上使用

js代码

$('.uEditorCustom').uEditor();

注意:如果文本框内容无法传输到数据库,通过$('.uEditorIframe').contents().find('#iframeBody').html(),获取到输入框内容,然后在ajaxSubmit()里面当做额外参数传递

屏蔽低版本浏览器不支持jQuery的浏览器

可以用js判断浏览器的版本,然后跳转到指定提示页面

第一百九十节,jQuery,编辑器插件的更多相关文章

  1. 第三百九十节,Django+Xadmin打造上线标准的在线教育平台—Django+cropper插件头像裁剪上传

    第三百九十节,Django+Xadmin打造上线标准的在线教育平台—Django+cropper插件头像裁剪上传 实现原理 前台用cropper插件,将用户上传头像时裁剪图片的坐标和图片,传到逻辑处理 ...

  2. 第一百九十九节,jQuery EasyUI,Panel(面板)组件

    jQuery EasyUI,Panel(面板)组件 学习要点: 1.加载方式 2.属性列表 3.事件列表 4.方法列表 本节课重点了解EasyUI中Panel(面板)组件的使用方法,这个组件不依赖于其 ...

  3. 第一百九十六节,jQuery EasyUI,Tooltip(提示框)组件

    jQuery EasyUI,Tooltip(提示框)组件 学习要点: 1.加载方式 2.属性列表 3.事件列表 4.方法列表 本节课重点了解 EasyUI 中 Tooltip(提示框)组件的使用方法, ...

  4. 第一百九十五节,jQuery EasyUI,Resizable(调整大小)组件

    jQuery EasyUI,Resizable(调整大小)组件 学习要点: 1.加载方式 2.属性列表 3.事件列表 4.方法列表 本节课重点了解 EasyUI 中 Resizeable(调整大小)组 ...

  5. 第一百九十四节,jQuery EasyUI,Droppable(放置)组件

    jQuery EasyUI,Droppable(放置)组件 学习要点: 1.加载方式 2.属性列表 3.事件列表 4.方法列表 本节课重点了解 EasyUI 中 Droppable(放置)组件的使用方 ...

  6. 第一百九十八节,jQuery EasyUI,ProgressBar(进度条)组件

    jQuery EasyUI,ProgressBar(进度条)组件 学习要点: 1.加载方式 2.属性列表 3.事件列表 4.方法列表 本节课重点了解 EasyUI 中 ProgressBar(进度条) ...

  7. 第一百九十三节,jQuery EasyUI,Draggable(拖动)组件

    Draggable(拖动)组件 学习要点: 1.加载方式 2.属性列表 3.事件列表 4.方法列表 本节课重点了解 EasyUI 中 Draggable(拖动)组件的使用方法,这个组件不依赖于其 他组 ...

  8. 第一百九十六天 how can I 坚持

    老妈邮的咸菜到了,美味啊,买不到,哈哈. 以后要勤给鱼换水啊,10天不换,水都臭了,拒绝懒惰. 明天要回济南了,刘松结婚,估计又没法发博客了. 两条鱼,一条罗娜,一条我,哈哈. 睡觉.

  9. 第一百九十五天 how can I 坚持

    晚上回来又肚子疼,拉肚子,咋搞的呢. 小米.华为.感觉虽然现在华为有些许优势,哎,还是不说了,感觉小米手机信号好像有问题. 中午吃的刀削面好像不熟,其实,怎么说呢,像开面馆,做的面顾客都吃不完,很明显 ...

随机推荐

  1. Synergy – 教你在局域网中用一套键盘/鼠标控制多台电脑

    想必很多人都拥有多台电脑,譬如台式机+笔记本,很多时候我们都会同时打开它们工作.可是你有没发现,如果桌子上摆放着多台电脑多套键盘鼠标,不停来回切换使用是否很累呢?如果说现在可以只用一套键鼠,就能同时控 ...

  2. oracle表空间操作语句

    1.查看所有表空间及表空间大小: select tablespace_name ,sum(bytes) / 1024 / 1024 as MB from dba_data_files group by ...

  3. 【sql】mysql数据库做两条数据替换的操作,不使用第三方变量

    需求: 1.将数据库中两条数据中的唯一约束列  做值的替换 原始思想: 将两条数据查出来,在程序中设置第三方变量,进行两条数据的替换,然后将原始两条数据删除,将新的两条替换后的数据插入. 新思想: 1 ...

  4. 设置cookie和查找cookie的方法

    1.设置cookie(名称,值,过期时间) function setCookie(key,value,d){ if(d === undefined){ document.cookie = encode ...

  5. OpenGL ES 3.0之Fragment buffer objects(FBO)详解 (转)

    http://www.cnblogs.com/salam/p/4957250.html 片段操作图 这篇文章将介绍从写入帧缓冲和读取帧缓冲的方式. Buffers(缓冲) OpenGL ES支持三种缓 ...

  6. docker 安装 gogs(go git server) 及问题解决

    docker安装gogs 参考官方说明 gogs mysql 支持 运行一个mysql image docker run --name gogs-mysql -e MYSQL_ROOT_PASSWOR ...

  7. POJ 2942 Knights of the Round Table 黑白着色+点双连通分量

    题目来源:POJ 2942 Knights of the Round Table 题意:统计多个个骑士不能參加随意一场会议 每场会议必须至少三个人 排成一个圈 而且相邻的人不能有矛盾 题目给出若干个条 ...

  8. 微信小程序bindtap和catchtap区别

    bindtap可以产生冒泡事件 catchtap只自身触发事件,不会传递到父视图         文章来源:刘俊涛的博客 地址:http://www.cnblogs.com/lovebing 欢迎关注 ...

  9. js比较数字相等

    示例代码: <!DOCTYPE html> <html lang="zh"> <head> <meta charset="UTF ...

  10. c++ builder xe2 字符串转日期

    TFormatSettings * fmt = new TFormatSettings; fmt->ShortDateFormat = L"yy-mm-dd"; fmt-&g ...