jquery-rockediter.js 7.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218
  1. /**
  2. 编辑器
  3. caratename:chenxihu
  4. caratetime:214-09-01 21:40:00
  5. email:qqqq2900@126.com
  6. homepage:www.xh829.com
  7. */
  8. var rockediterarray = [];
  9. (function ($) {
  10. function rockediter(contid, can){
  11. var me = this;
  12. this.selecttext = '';
  13. var obj = get(contid);
  14. var rand = js.getrand();
  15. this.oi = rockediterarray.length;
  16. this.formatarray={
  17. 'font':['字体样式','FontName', 'down'],
  18. 'fontsize':['字体大小','FontSize', 'down'],
  19. 'forecolor':['字体颜色','ForeColor', 'down'],
  20. 'marks':['插入特殊符号','Marks'],
  21. 'images':['上传图片','Images'],
  22. 'imageslink':['插入图片链接','Imageslink'],
  23. 'backcolor':['字体背景色','BackColor', 'down'],
  24. 'html':['查看源码','HTML'],
  25. 'arrow_out':['全屏',''],
  26. 'emot':['插入表情',''],
  27. 'cut':['剪切','Cut'],
  28. 'paste':['粘贴','Paste'],
  29. 'copy':['复制','Copy'],
  30. 'selectall':['全选','SelectAll'],
  31. 'hr':['添加水平线','InsertHorizontalRule'],
  32. 'link_add':['添加链接','CreateLink'],
  33. 'link_del':['删除链接','UnLink'],
  34. 'bold':['加粗','Bold'],
  35. 'italic':['斜体','Italic'],
  36. 'underline':['下划线','Underline'],
  37. 'strikethrough':['删除线','StrikeThrough'],
  38. 'align_center':['居中对齐','JustifyCenter'],
  39. 'align_justify':['两端对齐','JustifyFull'],
  40. 'align_left':['左对齐','JustifyLeft'],
  41. 'align_right':['右对齐','JustifyRight'],
  42. 'list_bullets':['项目符号','insertunorderedlist'],
  43. 'list_numbers':['数字编号','insertorderedlist'],
  44. 'indent':['增加缩进量','Indent'],
  45. 'indent_remove':['减小缩进量','Outdent'],
  46. 'undo':['返回上一步','Undo'],
  47. 'removeformat':['删除格式','RemoveFormat']
  48. }
  49. //初始化
  50. this.init = function(){
  51. this.createtbar();
  52. $('#'+contid+'_tbar a').click(function(event){
  53. me.toolsclick(event, this);
  54. return false;
  55. });
  56. };
  57. this.createtbar = function(){
  58. var a = can.tbaricons.split(',');
  59. var s = '';
  60. for(var i=0; i<a.length; i++){
  61. var s1 = a[i];
  62. if(s1=='|'){
  63. s+='<span>|</span>';
  64. }else{
  65. var c = this.formatarray[s1];
  66. s+='<a title="'+c[0]+'" href="javascript:" xtype="'+c[1]+'"><img src="images/editer/text_'+s1+'.png" class="icons" align="absmiddle">';
  67. if(can.showtext)s+=' '+c[0]+'';
  68. if(c[2] == 'down')s+='<img src="images/editer/desc.gif" style="margin-left:3px" align="absmiddle">';
  69. s+='</a>';
  70. }
  71. }
  72. $('#'+contid+'_tbar').html(s);
  73. };
  74. this.toolsclick = function(event, o1){
  75. var o = $(o1);
  76. var xtype = o.attr('xtype');
  77. this.selecttext = this.getSelText();
  78. if(xtype == 'Bold'){
  79. this.strreplace(this.selecttext, '[B]'+this.selecttext+'[/B]');
  80. }
  81. if(xtype == 'Italic'){
  82. this.strreplace(this.selecttext, '[I]'+this.selecttext+'[/I]');
  83. }
  84. if(xtype == 'Underline'){
  85. this.strreplace(this.selecttext, '[U]'+this.selecttext+'[/U]');
  86. }
  87. if(xtype == 'RemoveFormat'){
  88. this.removeformat();
  89. }
  90. if(xtype == 'CreateLink'){
  91. this.createlink();
  92. }
  93. if(xtype == 'Images'){
  94. this.uploadImages();
  95. }
  96. };
  97. this.createlink = function(){
  98. var h = '<div style="padding:10px;line-height:30px">';
  99. h+='<div style="padding:5px 0px"><font color="#888888">连接文字</font> <input id="createlinkwindow_text" style="width:50%" class="input" value="'+this.selecttext+'"></div>';
  100. h+='<div style="padding:5px 0px"><font color="#888888">连接地址</font> <input id="createlinkwindow_texturl" value="http://" class="input" style="width:78%"></div>';
  101. h+='</div>';
  102. js.tanbody('createlinkwindow', '添加连接', 400, 200, {html:h,btn:[{text:'确定'}]});
  103. get('createlinkwindow_texturl').focus();
  104. $('#createlinkwindow_btn0').click(function(){
  105. me.quedingadd();
  106. });
  107. };
  108. this.quedingadd = function(){
  109. var text = $('#createlinkwindow_text').val();
  110. var url = $('#createlinkwindow_texturl').val();
  111. var str1 = '[A,'+url+']'+text+'[/A]';
  112. if(isempt(text))return false;
  113. this.strreplace(text,str1);
  114. js.tanclose('createlinkwindow');
  115. };
  116. //清除格式
  117. this.removeformat = function(){
  118. var cont = obj.value;
  119. cont = cont.replace(/\[.*?\]/gi, '');
  120. cont = cont.replace(/\<.*?\>/gi, '');
  121. obj.value = cont;
  122. };
  123. this.addcont = function(str){
  124. obj.value+=str;
  125. };
  126. this.strreplace = function(str,str1){
  127. if(isempt(str) || !get(contid))return false;
  128. var cont = obj.value;
  129. var s = '';
  130. if(isIE){
  131. var patt1 = new RegExp(""+str+"", "gi");
  132. s = cont.replace(patt1, str1);
  133. }else{
  134. var st = obj.selectionStart;
  135. var et = obj.selectionEnd;
  136. s = cont.substr(0, st)+str1;
  137. s+=cont.substr(et);
  138. }
  139. get(contid).value = s;
  140. if(!isIE)get(contid).focus();
  141. };
  142. this.getSelText = function(){
  143. var o = obj;
  144. var txt = '';
  145. if(isIE){
  146. txt = document.selection.createRange().text;
  147. } else {
  148. txt = o.value.substr(o.selectionStart,o.selectionEnd-o.selectionStart);
  149. }
  150. return txt;
  151. };
  152. //删除图片
  153. this.uploadImages= function(){
  154. var h = '<div style="padding:10px;line-height:30px">';
  155. h+='<table width="100%" border="0" cellspacing="0" cellpadding="0">';
  156. h+='<tr>';
  157. h+=' <td width="110" height="110" align="center"><img id="createlinkwindow_imagesview" src="images/noface.jpg" width="100" height="100"></td>';
  158. h+=' <td style="padding:5px 10px;line-height:30px">';
  159. h+=' <div style="padding:5px 0px"><font color="#888888">图片地址:</font> &nbsp; <a href="javascript:" onclick="return rockediteruploadimage()">↑从本地上传</a></div>';
  160. h+=' <div style="padding:0px 0px"><input id="createlinkwindow_images" class="input" style="width:250px"></div>';
  161. //h+=' <div style="height:20px;overflow:hidden"></div>';
  162. //h+=' <div style="padding:5px 0px">宽:<input class="inputs" id="createlinkwindow_width" readonly style="width:60px"> &nbsp; 高:<input id="createlinkwindow_height" class="inputs" readonly style="width:60px"></div>';
  163. h+=' </td>';
  164. h+='</tr>';
  165. h+='</table>';
  166. h+='</div>';
  167. js.tanbody('createlinkwindow', '插入图片', 400, 200, {
  168. html:h,btn:[{text:'确定'}]
  169. });
  170. $('#createlinkwindow_btn0').click(function(){
  171. me.uploadImagesback();
  172. });
  173. };
  174. this.uploadImagesback= function(){
  175. var url = get('createlinkwindow_images').value;
  176. if(isempt(url))return false;
  177. this.addcont('[IMG,'+url+']');
  178. js.tanclose('createlinkwindow');
  179. return false;
  180. };
  181. }
  182. $.rockediter = function(contid,can){
  183. var fcan = js.apply({
  184. showtext : true,
  185. tbaricons : 'bold,italic,underline,|,link_add,images,removeformat'
  186. }, can);
  187. var clsa = new rockediter(contid, fcan);
  188. clsa.init();
  189. rockediterarray.push(clsa);
  190. return clsa;
  191. };
  192. })(jQuery);
  193. function rockediteruploadimage(){
  194. js.upload('rockediteruploadimageautoclose',{title:escape('本地上传图片'),maxup:1,uptype:'image',maxwidth:600});
  195. return false;
  196. }
  197. function rockediteruploadimageautoclose(a){
  198. var d = a[0];
  199. //$('#createlinkwindow_width').val(d.width);
  200. //$('#createlinkwindow_height').val(d.height);
  201. $('#createlinkwindow_images').val(d.thumbpath);
  202. get('createlinkwindow_imagesview').src=d.thumbpath;
  203. }