14.jQuery UI 编辑器插件

来源：互联网发布：mysql查询重复数据优化编辑：程序博客网时间：2024/06/06 16:37

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

一．引入uEditor

第一步：引入jquery-migrate-1.2.1.js 文件，排除编辑器低版本的问题。
第二步：把编辑器文件夹包放入根目录下。
第三步：引入uEditor.js 和uEditor.css 两个文件。
第四步：插入textarea，设置规定值。
第五步：jQuery 调用运行。

html :

<button id="question_button">提问</button><form id="question" action="123.html" method="post" title="提问">   <p>      <label for="user">问题名称：</label>      <input type="text" name="title" class="text" style="width:390px;" id="title" />      <span class="star"></span>   </p>   <p>      <textarea class="uEditorCustom" name="content">请填写问题描述！</textarea>   </p></form><div id="error">请登录后操作...</div>

jQuery :

$('#question_button').button({   icons : {      primary : 'ui-icon-lightbulb',   },}).click(function () {   if ($.cookie('user')) {      $('#question').dialog('open');   } else {      $('#error').dialog('open');      setTimeout(function () {         $('#error').dialog('close');         $('#login').dialog('open');      }, 1000);   }});$('#question').dialog({   autoOpen : false,   modal : true,   resizable : false,   width : 500,   height : 360,     buttons : {      '发布' : function () {         $(this).submit();      }   }});$('.uEditorCustom').uEditor();$('#error').dialog({   autoOpen : false,   modal : true,   closeOnEscape : false,   resizable : false,   draggable : false,   width : 180,   height : 50,}).parent().find('.ui-widget-header').hide();

0 0