From 37754d3c01607490e386f7ce580778cf892f352a Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E5=86=B0=E4=BC=98?= <30610976+iceuinet@users.noreply.github.com> Date: Mon, 22 Jun 2020 14:27:28 +0800 Subject: [PATCH] =?UTF-8?q?=E4=BF=AE=E5=A4=8DBUG?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit 修复上传网络图片链接width和height为0的BUG --- LICENSE | 2 +- README.md | 10 + demo.html | 8 +- iceEditor-min.js | 19 - iceEditor.js => src/iceEditor.js | 2182 ++++++++--------- src/iceEditor.min.js | 19 + upload.php => src/upload.php | 0 ...4\346\226\260\346\227\245\345\277\227.txt" | 98 + 8 files changed, 1223 insertions(+), 1115 deletions(-) delete mode 100644 iceEditor-min.js rename iceEditor.js => src/iceEditor.js (97%) create mode 100644 src/iceEditor.min.js rename upload.php => src/upload.php (100%) create mode 100644 "\346\233\264\346\226\260\346\227\245\345\277\227.txt" diff --git a/LICENSE b/LICENSE index edf2cf7..06281dc 100644 --- a/LICENSE +++ b/LICENSE @@ -20,4 +20,4 @@ LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE. -http://www.opensource.org/licenses/mit-license.php +http://www.opensource.org/licenses/mit-license.php \ No newline at end of file diff --git a/README.md b/README.md index 8d36092..bf04b50 100644 --- a/README.md +++ b/README.md @@ -17,6 +17,8 @@ iceEditor官方群:324415936 #### 最新更新 # iceEditor v1.1.6 ++ **2020-06-22** ++ [修复] 上传网络图片链接width和height为0的BUG + **2020-06-20** + [修复] textarea内容中的pre代码格式 + [新增] 新增代码语言(扩展) @@ -53,9 +55,17 @@ iceEditor官方群:324415936 #### 注意 iceEditor.js的引用禁止放在head标签内,请尽量放在body中或body后面! +#### 引入 ++ 下载下来直接引入iceEditor.js即可,放在body中或body后面 ++ 推荐引入下面的cdn加速链接 ++ CDN最新版:https://cdn.jsdelivr.net/gh/iceuinet/iceEditor/iceEditor.min.js ++ 需要CDN历史版,请更改@后面的版本号,最低为1.1.6版本 ++ 历史版:https://cdn.jsdelivr.net/gh/iceuinet/iceEditor@1.1.6/iceEditor.min.js + #### 使用 ```html
欢迎使用iceEditor富文本编辑器
+ ``` ```javascript //第一步:创建实例化对象 diff --git a/demo.html b/demo.html index 4f8089e..d4435bd 100644 --- a/demo.html +++ b/demo.html @@ -11,11 +11,11 @@
演示DEMO
官方:https://www.iceui.net/iceEditor.html
- + diff --git a/iceEditor-min.js b/iceEditor-min.js deleted file mode 100644 index 9de6b82..0000000 --- a/iceEditor-min.js +++ /dev/null @@ -1,19 +0,0 @@ -/** - +------------------------------------------------------------------------------------+ - + iceEditor(富文本编辑器) - +------------------------------------------------------------------------------------+ - + iceEditor v1.1.6 - * MIT License By www.iceui.net - + 作者:ice - + 官方:www.iceui.net - + 时间:2020-06-20 - +------------------------------------------------------------------------------------+ - + 版权声明:该版权完全归iceUI官方所有,可转载使用和学习,但请务必保留版权信息 - +------------------------------------------------------------------------------------+ - + iceEditor是一款简约风格的富文本编辑器,体型十分娇小,无任何依赖,整个编辑器只有一个 - + 文件,功能却很不平凡!简约的唯美设计,简洁、极速、使用它的时候不需要引用jQuery、font - + css……等文件,因为整个编辑器只是一个Js,支持上传图片、附件!支持添加音乐、视频! - +------------------------------------------------------------------------------------+ -*/ -"use strict";var ice=ice||{};ice.editor=function(a){var b,c,d;return this.menu=["backColor","fontSize","foreColor","bold","italic","underline","strikeThrough","line","justifyLeft","justifyCenter","justifyRight","indent","outdent","line","insertOrderedList","insertUnorderedList","line","superscript","subscript","createLink","unlink","line","hr","table","files","music","video","insertImage","removeFormat","line","code"],this.backColor=["#ffffff","#000000","#eeece1","#1f497d","#4f81bd","#c0504d","#9bbb59","#8064a2","#4bacc6","#f79646","#f2f2f2","#979797","#ddd9c3","#c6d9f0","#dbe5f1","#f2dcdb","#ebf1dd","#e5e0ec","#dbeef3","#fdeada","#d8d8d8","#595959","#c4bd97","#8db3e2","#b8cce4","#e5b9b7","#d7e3bc","#ccc1d9","#b7dde8","#fbd5b5","#bfbfbf","#3f3f3f","#938953","#548dd4","#95b3d7","#d99694","#c3d69b","#b2a2c7","#92cddc","#fac08f","#a5a5a5","#262626","#494429","#17365d","#366092","#953734","#76923c","#5f497a","#31859b","#e36c09","#7f7f7f","#0c0c0c","#1d1b10","#0f243e","#244061","#632423","#4f6128","#3f3151","#205867","#974806","#c00000","#ff0000","#ffc000","#ffff00","#92d050","#00b050","#00b0f0","#0070c0","#002060","#7030a0"],this.foreColor=this.backColor,this.width="100%",this.height="400px",this.code=0,this.maxWindow=1,this.disabled=0,this.css="",this.uploadUrl=0,this.screenshot=1,this.screenshotUpload=1,this.htmlTag=["meta","style","script","object","form","iframe"],this.formatTag=["address","caption","dd","div","dl","dt","fieldset","h1","h2","h3","h4","h5","h6","legend","fieldset","li","noframes","noscript","ol","ul","p","pre","table","tbody","tfoot","th","thead","tr"],this.getTime="1"+String((new Date).getTime()).substr(4,8),this.iframeId="_iframe"+this.getTime,this.toolId="_tool"+this.getTime,this.linkId="_link"+this.getTime,this.linkInputId="_LinkInput"+this.getTime,this.musicId="_music"+this.getTime,this.musicInputId="_musicInput"+this.getTime,this.videoId="_video"+this.getTime,this.imageId="_image"+this.getTime,this.imgUploadId="_imgUpload"+this.getTime,this.filesId="_files"+this.getTime,this.filesUploadId="_filesUpload"+this.getTime,this.tableId="_table"+this.getTime,this.dragId="_drag"+this.getTime,this.menuList={},b=this,this.editor=this.id(a),this.editor?(this.textarea=0,"TEXTAREA"!==this.editor.nodeName&&"DIV"!==this.editor.nodeName?console.log("暂不支持该标签-->"+this.editor.nodeName+" 推荐使用div"):("TEXTAREA"==this.editor.nodeName?(this.editor.style.display="none",this.divId="_div"+this.getTime,c=this.c("div"),c.className="iceEditor",c.id=this.divId,this.insertAfter(c,this.editor),this.textarea=this.editor,this.editor=this.id(this.divId),this.value=this.textarea.value):(this.editor.className="iceEditor",this.value=this.editor.innerHTML,this.editor.innerHTML=""),this.cssConfig=this.c("style"),this.cssConfig.type="text/css",this.editor.appendChild(this.cssConfig),this.tool=this.c("div"),this.tool.id=this.toolId,this.tool.className="iceEditor-tool iceEditor-noselect",this.editor.appendChild(this.tool),this.iframe=this.c("iframe"),this.iframe.id=this.iframeId,this.iframe.className="iceEditor-noselect",this.iframe.frameBorder=0,this.editor.appendChild(this.iframe),this.dragBg=this.c("div"),this.dragBg.className="iceEditor-dragBg",this.editor.appendChild(this.dragBg),this.drag=this.c("div"),this.drag.id=this.dragId,this.drag.className="iceEditor-drag iceEditor-noselect",this.drag.innerHTML='',this.editor.appendChild(this.drag),this.drag.onmousedown=function(){var a,c;b.dragBg.style.display="block",a=event.clientY,c=b.iframe.clientHeight,window.onmousemove=function(){var d=event.clientY-a;c>=100?(b.iframe.height=c+d+"px",b.height=c+d+"px"):(b.iframe.height="100px",b.height=c+d+"px")},window.onmouseup=function(){window.onmousemove=null,window.onmouseup=null,b.dragBg.style.display="none"}},this.disableds=this.c("div"),this.disableds.className="iceEditor-disabled",this.editor.appendChild(this.disableds),this.w=this.iframe.contentWindow,this.d=this.iframe.contentDocument,this.d.open(),d=this.value.trim(),d.length&&"

"==d.substr(0,3)||(d="

"+this.value+"

"),this.d.write(''+d+""),this.d.close(),this.d.body.designMode="On",this.d.body.contentEditable=!0,this.d.body.addEventListener("click",function(){b.parentTagName=b.range.anchorNode.parentNode.tagName}),this.content=this.d.body,this.textarea&&setInterval(function(){var d,e,a=b.code?b.html(b.getHTML()):b.getHTML(),c=b.c("p");for(c.innerHTML=a,d=c.getElementsByTagName("pre"),e=0;e/g,"\n");b.textarea.innerHTML=b.unhtml(c.innerHTML)},1e3),this.init(),this.create(),this.paste(),void 0)):alert("请提供一个有效的id")},ice.editor.prototype={id:function(a){return document.getElementById(a)},c:function(a){return document.createElement(a)},init:function(){this.files=null,this.insertImage=null,this.element=this.d.body,this.range=this.d.createRange?this.w.getSelection():this.d.selection.createRange()},insertAfter:function(a,b){var c=b.parentNode;c.lastChild==b?c.appendChild(a,b):c.insertBefore(a,b.nextSibling)},setHTML:function(a,b){this.element.focus();var c=this.range.getRangeAt(0);b||a.appendChild(c.extractContents()),c.deleteContents(),c.insertNode(this.w.document.createDocumentFragment().appendChild(a)),c.collapse(!1)},setText:function(a,b){var c,d,f,g,e;for(this.element.focus(),c=this.range.getRangeAt(0),c.deleteContents(),d=document.createElement("div"),b?d.innerHTML=a:d.appendChild(document.createTextNode(a)),e=document.createDocumentFragment();f=d.firstChild;)g=e.appendChild(f);c.insertNode(e),g&&(c=c.cloneRange(),c.setStartAfter(g),c.collapse(!0),this.range.removeAllRanges(),this.range.addRange(c))},getSelectHTML:function(){var a=this.c("p");return a.appendChild(this.range.getRangeAt(0).cloneContents()),a.innerHTML},getSelectText:function(){return"false"==this.range.toString()||""==this.range.toString()?"":this.range.toString()},unhtml:function(a){var b="";return 0==a.length?"":(b=a.replace(/&/g,"&"),b=b.replace(//g,">"),b=b.replace(/\'/g,"'"),b=b.replace(/\"/g,"""))},html:function(a){var b="";return 0==a.length?"":(b=a.replace(/</g,"<"),b=b.replace(/>/g,">"),b=b.replace(/'/g,"'"),b=b.replace(/"/g,'"'),b=b.replace(/&/g,"&"))},toText:function(a){var c,b=this.c("div");return null!=b.textContent?b.textContent=a:b.innerText=a,c=b.innerHTML,b=null,c},toHTML:function(a){var c,b=this.c("div");return b.innerHTML=a,c=b.innerText||b.textContent,b=null,c},inNodeParent:function(a,b){return a?a.parentNode?"string"==typeof b?(b=b.toUpperCase(),a.tagName==b?!0:a.parentNode.tagName==b?!0:this.inNodeParent(a.parentNode,b)):a.parentNode==b?!0:this.inNodeParent(a.parentNode,b):!1:!1},inArray:function(a,b){if("string"==typeof a||"number"==typeof a){for(var c in b)if(a===b[c])return!0;return!1}},popup:function(a){var b,c,d,e;return a=a||{},b=a.width||"400",c=a.height||"200",d=a.title||"",e=a.content||"",'
'+d+'
'+e+"
"},getCoords:function(a){var b=a.getBoundingClientRect(),c=a.ownerDocument,d=c.body,e=c.documentElement,f=e.clientTop||d.clientTop||0,g=e.clientLeft||d.clientLeft||0,h=b.top-f,i=b.left-g;return{top:h,left:i}},pd:function(){window.event?window.event.cancelBubble=!0:e.stopPropagation()},isIE:function(){return!!window.ActiveXObject||"ActiveXObject"in window},ajax:function(a){if(a=a||{},a.url){a.timeout=a.timeout||15e3,a.data=a.data||{};var b=new XMLHttpRequest;b.open("POST",a.url,!0),b.setRequestHeader("X-Requested-With","XMLHttpRequest"),b.send(a.data),a.loading&&a.loading(),a.timer=setTimeout(function(){b.onreadystatechange=null,a.error&&a.error("网络超时。")},a.timeout),b.onreadystatechange=function(){var c;4==b.readyState&&(clearTimeout(a.timer),b.status>=200&&b.status<300||304==b.status?(c=b.responseText.length>0?JSON.parse(b.responseText):"",a.success&&a.success(c)):a.error&&a.error(b.status))}}},imagesUpload:function(){var a=this,b=a.insertImage.getElementsByClassName("iceEditor-popup")[0],c=a.insertImage.getElementsByClassName("iceEditor-insertImageUrl")[0],d=a.insertImage.getElementsByClassName("iceEditor-inputWidth")[0],e=a.insertImage.getElementsByClassName("iceEditor-inputHeight")[0],f=a.insertImage.getElementsByClassName("iceEditor-btn")[0];f.onclick=function(){var f=a.c("img");f.src=c.value,f.width=d.value,f.height=e.value,a.setHTML(f),b.style.display="none",a.pd()},a.id(a.imgUploadId).onchange=function(){var c,d;if(!a.uploadUrl)return alert("请配置uploadUrl项");for(console.log(this.files),c=new FormData,d=0;d1))return alert("b站"+j);if(k=k[0].split("video/"),!(k.length>1&&k[1].length))return alert("b站"+j);i.src="https://player.bilibili.com/player.html?bvid="+k[1]}else if(3===b){if(k=d.value.split(".html"),!(k.length>1))return alert("优酷:"+j);if(k=k[0].split("id_"),!(k.length>1&&k[1].length))return alert("优酷:"+j);i.src="https://player.youku.com/embed/"+k[1]}a.setHTML(i,!0),c.style.display="none",a.pd()}},createMenu:function(a){var d,e,f,b=this,c=this.c("li");if(a.id&&(c.id=a.id),a.css&&(c.className=a.css),a.style&&(this.css+=a.style),(a.menu||a.icon)&&(d=this.c("div"),d.className="iceEditor-exec",a.menu?d.innerHTML=a.menu:a.icon&&(d.innerHTML=''),a.data&&d.setAttribute("data",a.data),c.appendChild(d)),a.dropdown)for(d=this.c("div"),d.className="iceEditor-menuDropdown",d.innerHTML=a.dropdown,c.appendChild(d),c.openMenu=1,c.onmouseover=function(){c.openMenu&&(d.className="iceEditor-menuDropdown iceEditor-menuActive")},c.onmouseout=function(){d.className="iceEditor-menuDropdown"},e=d.getElementsByClassName("iceEditor-exec"),f=0;f
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 文字大小
  • '}),a='
      ',b=0;b';for(a+='
    • 文字背景颜色
    ',this.createMenu({name:"backColor",icon:"backColor",dropdown:a}),a='
      ',b=0;b';a+='
    • 文字颜色
    ',this.createMenu({name:"foreColor",icon:"foreColor",dropdown:a}),this.createMenu({name:"bold",data:"bold",icon:"bold"}),this.createMenu({name:"italic",data:"italic",icon:"italic"}),this.createMenu({name:"underline",data:"underline",icon:"underline"}),this.createMenu({name:"strikeThrough",data:"strikeThrough",icon:"strike"}),this.createMenu({name:"justifyLeft",data:"justifyLeft",icon:"alignleft"}),this.createMenu({name:"justifyCenter",data:"justifyCenter",icon:"aligncenter"}),this.createMenu({name:"justifyRight",data:"justifyRight",icon:"alignright"}),this.createMenu({name:"indent",data:"indent",icon:"indent"}),this.createMenu({name:"outdent",data:"outdent",icon:"outdent"}),this.createMenu({name:"insertOrderedList",data:"insertOrderedList",icon:"orderedlist"}),this.createMenu({name:"insertUnorderedList",data:"insertUnorderedList",icon:"unorderedlist"}),this.createMenu({name:"subscript",data:"subscript",icon:"subscript"}),this.createMenu({name:"superscript",data:"superscript",icon:"superscript"}),this.createMenu({name:"unlink",data:"unlink",icon:"unlink"}),this.createMenu({name:"hr",data:"insertHorizontalRule",icon:"min"}),this.createMenu({name:"removeFormat",data:"removeFormat",icon:"remove"}),this.createMenu({name:"selectAll",data:"selectAll",icon:"empty"}),this.createMenu({name:"code",icon:"code",data:"code"}),this.createMenu({name:"line",css:"line"}),this.createMenu({name:"table",icon:"table",dropdown:'
    • 表格:1×1
    '}),this.createMenu({name:"createLink",icon:"link",id:this.linkId,popup:{width:380,height:110,title:"添加链接",content:''}}),this.createMenu({name:"music",icon:"music",id:this.musicId,popup:{width:380,height:80,title:"添加音乐",content:'
    音乐链接:确定
    '}}),this.createMenu({name:"files",icon:"files",id:this.filesId,popup:{width:450,height:250,title:"附件上传",content:'
    '}}),this.createMenu({name:"insertImage",icon:"pic",id:this.imageId,popup:{width:450,height:250,title:"图片上传",content:'
    URL:宽:高:确定
    '}}),this.createMenu({name:"video",icon:"video",id:this.videoId,popup:{width:450,height:170,title:"添加视频",content:'
    URL:
    宽:高:确定
    '}}),this.createMenu({name:"max",icon:"max",data:"max",css:"iceEditor-maxWindow"}),this.createMenu({name:"min",icon:"min",data:"min",css:"iceEditor-minWindow"}),this.createMenu({name:"disabled",css:"iceEditor-disabledMask"})},ice.editor.prototype.menuFormat=function(){var b,c,d,e,f,a=this;for(this.menuHTML(),b=this.c("ul"),b.className="iceEditor-menu",c=0;c]+>/gi,"").replace(/<\s*\/a\s*>/gi,""),c=a.c("a");a.link.getElementsByTagName("input")[1].checked&&(c.target="_blank"),c.href=a.linkInput.value,c.innerHTML=b,a.setHTML(c,!0),a.link.getElementsByClassName("iceEditor-popup")[0].style.display="none",a.pd()}),this.inArray("music",this.menu)&&(this.music=this.id(this.musicId),this.musicInput=this.id(this.musicInputId),a.music.getElementsByClassName("iceEditor-btn")[0].onclick=function(){var b=a.c("audio");b.src=a.musicInput.value,b.controls="controls",a.setHTML(b,!0),a.music.getElementsByClassName("iceEditor-popup")[0].style.display="none",a.pd()}),this.inArray("video",this.menu)&&(this.video=this.id(this.videoId),this.addVideo()),this.inArray("files",this.menu)&&(this.files=this.id(this.filesId),this.filesUpload()),this.inArray("insertImage",this.menu)&&(this.insertImage=this.id(this.imageId),this.imagesUpload()),this.inArray("table",this.menu)&&(this.table=this.id(this.tableId),d=this.table.getElementsByClassName("iceEditor-tableBox")[0],e=this.table.getElementsByClassName("iceEditor-tableBgOn")[0],f=this.table.getElementsByClassName("iceEditor-tableNum")[0],d.onmouseover=function(){var c=a.getCoords(this),d=1,g=1;this.onmousemove=function(a){var b=a||event,h=b.clientX-c.left-5,i=b.clientY-c.top-5;180>=h&&180>=i&&(d=Math.ceil(h/18),g=Math.ceil(i/18),e.style.width=18*d+"px",e.style.height=18*g+"px",f.innerHTML="表格:"+d+"×"+g)},this.onmousedown=function(){var c,e,f,h,b=a.c("table");for(b.width="100%",b.border=1,b.style.border="1px solid #bdbdbd",b.style.borderSpacing=0,b.style.borderCollapse="collapse",b.className="table table-border",c=0;g>c;c++)for(e=b.insertRow(),f=0;d>f;f++)h=e.insertCell(),h.innerHTML="
    ";a.setHTML(b,!0)},this.onmouseout=function(){this.onmousemove=null,this.onmouseout=null}}),this.editor.style.width=this.width,this.iframe.width=this.width,this.iframe.height=this.height},ice.editor.prototype.menuAction=function(){var c,a=this.tool.getElementsByClassName("iceEditor-exec"),b=this;for(c=0;c");else{for(b.tool.className="iceEditor-tool iceEditor-noselect",e.style.display="block",this.className="iceEditor-exec iceEditor-active",b.code=1,b.d.body.className="iceEditor-code",g=b.d.body.getElementsByTagName("pre"),h=0;h/g,"\n");f=b.getHTML(),f=f.replace(/<\/p>

    /gim,"

    \n

    ").replace(/>

    \n\n<"),b.d.body.innerHTML=b.unhtml(f)}break;case"max":i=window.innerHeight,"number"!=typeof i&&("CSS1Compat"==document.compatMode?i=document.documentElement.clientHeight:webWidth=document.body.clientWidth),b.editor.style.position="fixed",b.editor.style.zIndex=b.getTime,b.editor.style.width="100%",b.editor.style.height="100%",b.editor.style.top=0,b.editor.style.left=0,b.iframe.height=i-35-20+"px",this.parentNode.style.display="none",b.tool.getElementsByClassName("iceEditor-minWindow")[0].style.display="block";break;case"min":b.editor.removeAttribute("style"),b.iframe.height=b.height,this.parentNode.style.display="none",b.tool.getElementsByClassName("iceEditor-maxWindow")[0].style.display="block";break;default:j=this.attr.split("|"),j.length>1?b.w.document.execCommand(j[0],!1,j[1]):b.w.document.execCommand(j[0],!1,null),b.range.getRangeAt(0).collapse()}return!1})},ice.editor.prototype.paste=function(){function d(a){if(!a)return!1;var b=a.nextSibling;return b&&1!=b.nodeType&&(b=d(b)),b}var a=this,b=function(b){function e(a){var b,c,d,e;for(b=a.split(",")[0].indexOf("base64")>=0?atob(a.split(",")[1]):unescape(a.split(",")[1]),c=a.split(",")[0].split(":")[1].split(";")[0],d=new Uint8Array(b.length),e=0;e"),!0),void 0}if(i=f.split("\n"),1==i.length)return a.setText(f),void 0;for(j=0;j
    ":"
    ",c=a.range.getRangeAt(0),c.insertNode(c.createContextualFragment(g)),h=a.range.anchorNode.nextSibling.nextSibling,c.setStart(h,0),c.setEnd(h,0),c.collapse()):("PRE"==a.parentTagName||"PRE"==a.range.anchorNode.tagName)&&a.setText("
    ",!0),b.preventDefault(),void 0;if(b.ctrlKey||b.metaKey)switch(b.keyCode){case 13:console.log(1),b.preventDefault();break;case 66:case 98:case 73:case 105:case 85:case 117:b.preventDefault()}})},ice.editor.prototype.create=function(){this.cssConfig.styleSheet?this.cssConfig.styleSheet.cssText=this.css:this.cssConfig.innerHTML=this.css,this.menuFormat(),this.menuAction(),this.disableds.style.display=this.disabled?"block":"none"},ice.editor.prototype.getHTML=function(){return this.content.innerHTML},ice.editor.prototype.getText=function(){return this.content.innerText},ice.editor.prototype.setValue=function(a){this.content.innerHTML=a},ice.editor.prototype.addValue=function(a){this.content.innerHTML+=a},ice.editor.css='.iceEditor{color:#353535;font-family:"Microsoft YaHei";font-size:14px;background:#fff;position:relative;border:solid 1px #ccc}.iceEditor *{margin:0;padding:0;box-sizing:border-box}.iceEditor a{color:#606060;text-decoration:none;-webkit-tap-highlight-color:transparent}.iceEditor a:hover{color:#000}.iceEditor input{height:27px;line-height:27px;padding:3px;border:1px solid #B7B7B7;font-family:inherit;font-size:inherit;vertical-align:middle;outline:none}.iceEditor-exec{cursor:pointer}.iceEditor-icon{width:16px;height:16px;fill:currentColor;overflow:hidden;vertical-align:middle;font-size:16px}.iceEditor-noselect{-webkit-touch-callout:none;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.iceEditor-menuDropdown{min-width:35px;min-height:35px;transition:all .4s ease;top:50px;opacity:0;visibility:hidden;position:absolute;background:#fff;z-index:999;box-shadow:0 2px 9px 0 rgba(0,0,0,.2);border-bottom:2px solid #676767;border-top:1px solid #676767}.iceEditor-menuDropdown::before{content:"";display:block;width:0;height:0;border-left:8px solid transparent;border-right:8px solid transparent;border-bottom:8px solid #676767;position:absolute;top:-8px;left:9px}.iceEditor-menuTitle{width:100%!important;text-align:center;height:30px;line-height:30px;border-top:1px solid #efefef}.iceEditor-tool{width:100%;background:#eee;border-bottom:solid 1px #ccc;position:relative}.iceEditor-tool:after,.iceEditor-tool:before{display:table;content:" "}.iceEditor-tool:after{clear:both}.iceEditor-menu{width:100%;padding:0 10px;display:inline-block;float:left}.iceEditor-menu a{list-style:none;float:left;min-width:35px;height:35px;padding:0 5px;text-align:center;line-height:35px;cursor:pointer}.iceEditor-menu a:hover{background:#cdcdcd}.iceEditor-menu>li>div.iceEditor-exec{list-style:none;float:left;min-width:35px;height:35px;padding:0 5px;text-align:center;line-height:35px;cursor:pointer}.iceEditor-menu>li>div.iceEditor-exec:hover{background:#cdcdcd}.iceEditor-menu svg{fill:currentColor;overflow:hidden;vertical-align:middle;font-size:16px}.iceEditor-menu .iceEditor-active{background:#e0e0e0;position:relative;z-index:999}.iceEditor-menu .iceEditor-disabledMask{background:rgba(238,238,238,0.7);width:100%;height:100%;position:absolute;left:0;top:0;display:none}.iceEditor-menu li{display:inline-block;float:left}.iceEditor-menu li .iceEditor-menuDropdown.iceEditor-menuActive{top:44px;opacity:1;visibility:visible}.iceEditor-menu li.iceEditor-minWindow{display:none}.iceEditor-menu li.iceEditor-maxWindow,.iceEditor-menu li.iceEditor-minWindow{float:right}.iceEditor-menu li.iceEditor-maxWindow>div,.iceEditor-menu li.iceEditor-minWindow>div{position:relative;z-index:999}.iceEditor-menu li.iceEditor-maxWindow .iceEditor-icon,.iceEditor-menu li.iceEditor-minWindow .iceEditor-icon{color:#606060}.iceEditor-codeLanguages select{padding:5px 5px;width:120px;outline:none;font-size:15px;margin-top:10px;}.iceEditor-line{height:35px;border-right:1px solid #ccc;width:1px;margin:0 10px;vertical-align:middle}.iceEditor-uploadInput{display:none}.iceEditor-uploadBtn{float:none;width:auto;font-size:15px;background:#00b7ee;height:40px;line-height:40px;padding:0 30px;color:#fff;display:inline-block;margin:0 auto 15px auto;cursor:pointer;box-shadow:0 1px 1px rgba(0,0,0,.1)}.iceEditor-uploadBtn:hover{background:#009ccb}.iceEditor-uploadIcon{width:45px;height:45px;color:#bababa;margin:45px 20px 10px}.iceEditor-backColor{width:230px;padding:5px}.iceEditor-backColor span{width:20px;height:20px;padding:0;margin:1px;display:inline-block}.iceEditor-fontSize{width:280px}.iceEditor-fontSize li{width:40px;text-align:center}.iceEditor-fontSize span{width:40px;display:inline-block;padding:10px 0}.iceEditor-fontSize span:hover{background:#eee;color:#4CAF50}.iceEditor-createLink label{margin-top:10px;display:inline-block;}.iceEditor-link{width:230px;}.iceEditor-popup .iceEditor-insertImage{text-align:center}.iceEditor-popup .iceEditor-insertImageUrl{width:140px;height:27px;outline:0;margin-right:15px}.iceEditor-popup .iceEditor-inputWidth{width:50px;height:27px;outline:0;margin-right:15px}.iceEditor-popup .iceEditor-inputHeight{width:50px;height:27px;outline:0}.iceEditor-popup .iceEditor-btn{width:auto;display:inline-block;float:none;color:#fff!important;height:27px;line-height:25px;padding:0 10px;background:#939393;vertical-align:middle;margin-left:5px;border:1px solid #7b7b7b}.iceEditor-popup .iceEditor-btn:hover{background:#7b7b7b!important;color:#fff}.iceEditor-tableBox{position:relative;width:190px;height:214px;padding:5px;overflow:hidden}.iceEditor-tableBgOn{position:absolute!important;top:5px;left:5px;z-index:4;width:18px;height:18px;background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABIAAAASAgMAAAAroGbEAAAACVBMVEUAAIjd6vvD2f9LKLW+AAAAAXRSTlMAQObYZgAAAAFiS0dEAIgFHUgAAAAJcEhZcwAACxMAAAsTAQCanBgAAAAHdElNRQfYAR0BKwNDEVT0AAAAG0lEQVQI12NgAAOtVatWMTCohoaGUY+EmIkEAEruEzK2J7tvAAAAAElFTkSuQmCC) repeat}.iceEditor-tableBgOff{width:180px;height:180px;background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABIAAAASAgMAAAAroGbEAAAACVBMVEUAAIj4+Pjp6ekKlAqjAAAAAXRSTlMAQObYZgAAAAFiS0dEAIgFHUgAAAAJcEhZcwAACxMAAAsTAQCanBgAAAAHdElNRQfYAR0BKhmnaJzPAAAAG0lEQVQI12NgAAOtVatWMTCohoaGUY+EmIkEAEruEzK2J7tvAAAAAElFTkSuQmCC) repeat}.iceEditor-tableNum{height:30px;line-height:30px;text-align:center;color:#757575}.iceEditor-video{text-align:left}.iceEditor-video label{margin-right:20px;display:inline-block}.iceEditor-video input{margin-right:5px}.iceEditor-video div{height:27px;margin-bottom:10px}.iceEditor-popup .iceEditor-videoUrl{width:380px;height:27px;outline:0;margin-right:0}.iceEditor-content{width:100%;height:100%;padding:20px;position:relative}.iceEditor-content:focus{outline:0}.iceEditor-dragBg{position:absolute;width:100%;height:100%;top:0;left:0;z-index:1;display:none;}.iceEditor-drag{color:#757575;background:#eee;text-align:center;height:12px;line-height:0;cursor:n-resize}.iceEditor-disabled{position:absolute;width:100%;height:100%;top:0;left:0;background:rgba(191,191,191,.79);z-index:99999;display:none}.iceEditor-popup{display:none}.iceEditor-popupMain{width:400px;height:200px;position:fixed;margin:auto;top:0;bottom:0;left:0;right:0;background:#fff;box-shadow:0 1px 1px rgba(0,0,0,.12);z-index:2;animation-name:iceEditorPopup;animation-duration:.5s}.iceEditor-popupBox{width:100%;height:100%;position:fixed;top:0;left:0;background:rgba(0,0,0,.33);opacity:.5;filter:alpha(opacity=50);z-index:1}.iceEditor-popupTitle{width:100%;height:30px;line-height:30px;background:#2f2f2f;padding:0 10px;color:#fff}.iceEditor-popupTitle span{display:inline-block;vertical-align:middle}.iceEditor-popupTitle::before{content:"";display:inline-block;width:10px;height:10px;border-radius:10px;background:#c7f98c;vertical-align:middle;margin-right:8px}.iceEditor-popupClose{float:right;padding:0 10px;color:#fff;font-size:18px;cursor:pointer}.iceEditor-popupClose:hover{color:#8fe5ff}.iceEditor-popupContent{width:100%;padding:10px;color:#000;overflow:auto;float:left}.iceEditor-popupBtn{width:100%;border:0;color:#fff;background:#03A9F4;border-top:1px solid #efefef;padding:0 20px;margin:0;height:35px;text-align:center;line-height:35px;cursor:pointer;margin-top:20px;outline:0}.iceEditor-popupBtn:hover{color:#151515;background:#efefef}@keyframes iceEditorPopup{0%{top:-100px;opacity:0}to{top:0;opacity:1}}@media (max-width:768px){.iceEditor-menu .iceEditor-line{display:none}.iceEditor-popupMain{margin:0!important;width:90%!important;height:90%!important;top:5%!important;left:5%!important}@keyframes iceEditorPopup{0%{margin-top:-50px}to{margin-top:0}}}',ice.editor.svg='',function(){var b,c,a=document.createElement("style"),d=document.body; -a.type="text/css",a.styleSheet?a.styleSheet.cssText=ice.editor.css:a.innerHTML=ice.editor.css,document.getElementsByTagName("head")[0].appendChild(a),b=document.createElement("div"),b.innerHTML=ice.editor.css+ice.editor.svg,ice.editor.svg=null,c=b.getElementsByTagName("svg")[0],c&&(c.setAttribute("aria-hidden","true"),c.style.position="absolute",c.style.width=0,c.style.height=0,c.style.overflow="hidden",d.firstChild?d.firstChild.parentNode.insertBefore(c,d.firstChild):d.appendChild(c))}(); \ No newline at end of file diff --git a/iceEditor.js b/src/iceEditor.js similarity index 97% rename from iceEditor.js rename to src/iceEditor.js index f73bf98..2cf385e 100644 --- a/iceEditor.js +++ b/src/iceEditor.js @@ -1,1092 +1,1092 @@ -/** - +------------------------------------------------------------------------------------+ - + iceEditor(富文本编辑器) - +------------------------------------------------------------------------------------+ - + iceEditor v1.1.6 - * MIT License By www.iceui.net - + 作者:ice - + 官方:www.iceui.net - + 时间:2020-06-20 - +------------------------------------------------------------------------------------+ - + 版权声明:该版权完全归iceUI官方所有,可转载使用和学习,但请务必保留版权信息 - +------------------------------------------------------------------------------------+ - + iceEditor是一款简约风格的富文本编辑器,体型十分娇小,无任何依赖,整个编辑器只有一个 - + 文件,功能却很不平凡!简约的唯美设计,简洁、极速、使用它的时候不需要引用jQuery、font - + css……等文件,因为整个编辑器只是一个Js,支持上传图片、附件!支持添加音乐、视频! - +------------------------------------------------------------------------------------+ -*/ -'use strict'; -var ice = ice || {}; -ice.editor = function(id){ - - //------------------------参数配置 开始------------------------ - // 工具栏菜单 - this.menu=[ - 'backColor','fontSize','foreColor','bold','italic','underline','strikeThrough','line','justifyLeft', - 'justifyCenter','justifyRight','indent','outdent','line','insertOrderedList','insertUnorderedList','line','superscript', - 'subscript','createLink','unlink','line','hr','table','files','music','video','insertImage', - 'removeFormat','line','code' - ]; - // 文字背景颜色 - this.backColor = [ - '#ffffff','#000000','#eeece1','#1f497d','#4f81bd','#c0504d','#9bbb59','#8064a2','#4bacc6','#f79646', - '#f2f2f2','#979797','#ddd9c3','#c6d9f0','#dbe5f1','#f2dcdb','#ebf1dd','#e5e0ec','#dbeef3','#fdeada', - '#d8d8d8','#595959','#c4bd97','#8db3e2','#b8cce4','#e5b9b7','#d7e3bc','#ccc1d9','#b7dde8','#fbd5b5', - '#bfbfbf','#3f3f3f','#938953','#548dd4','#95b3d7','#d99694','#c3d69b','#b2a2c7','#92cddc','#fac08f', - '#a5a5a5','#262626','#494429','#17365d','#366092','#953734','#76923c','#5f497a','#31859b','#e36c09', - '#7f7f7f','#0c0c0c','#1d1b10','#0f243e','#244061','#632423','#4f6128','#3f3151','#205867','#974806', - '#c00000','#ff0000','#ffc000','#ffff00','#92d050','#00b050','#00b0f0','#0070c0','#002060','#7030a0' - ]; - //文字颜色 - this.foreColor = this.backColor; - //编辑器的尺寸 - this.width='100%'; - this.height='400px'; - //查看源码 - this.code=0; - //窗口最大化和最小化 - this.maxWindow=1; - //编辑器禁用 - this.disabled=0; - //编辑器样式 - this.css = ''; - //图片和附件提交地址 - this.uploadUrl=0; - //截图粘贴启用 - this.screenshot=1; - //截图粘贴直接上传到服务期 - this.screenshotUpload=1; - //HTML标签过滤黑名单-忽略粘贴过来的HTML标签 - this.htmlTag=['meta','style','script','object','form','iframe']; - //HTML标签 将该块级元素标签同意格式化为p标签 - this.formatTag=['address','caption','dd','div','dl','dt','fieldset','h1','h2','h3','h4','h5','h6','legend','fieldset','li','noframes','noscript','ol','ul','p','pre','table','tbody','tfoot','th','thead','tr']; - //------------------------参数配置 结束------------------------ - //构建功能模块唯一id - this.getTime ='1'+ String(new Date().getTime()).substr(4,8); - this.iframeId = '_iframe'+this.getTime; - this.toolId = '_tool'+this.getTime; - this.linkId = '_link'+this.getTime; - this.linkInputId = '_LinkInput'+this.getTime; - this.musicId = '_music'+this.getTime; - this.musicInputId = '_musicInput'+this.getTime; - this.videoId = '_video'+this.getTime; - this.imageId = '_image'+this.getTime; - this.imgUploadId = '_imgUpload'+this.getTime; - this.filesId = '_files'+this.getTime; - this.filesUploadId = '_filesUpload'+this.getTime; - this.tableId = '_table'+this.getTime; - this.dragId = '_drag'+this.getTime; - - //菜单列表对象 - this.menuList={}; - - //获取编辑器对象 - var _z=this; - this.editor = this.id(id); - if(!this.editor) return alert('请提供一个有效的id'); - this.textarea = 0; - // 只能是 textarea 和 div ,其他类型的元素不行 - if (this.editor.nodeName !== 'TEXTAREA' && this.editor.nodeName !== 'DIV') { - return console.log('暂不支持该标签-->'+this.editor.nodeName+' 推荐使用div'); - } - if(this.editor.nodeName == 'TEXTAREA'){ - this.editor.style.display='none'; - this.divId = '_div'+this.getTime; - var div = this.c('div'); - div.className='iceEditor'; - div.id=this.divId; - this.insertAfter(div,this.editor); - - //加载编辑器的内容 - this.textarea = this.editor; - this.editor = this.id(this.divId); - this.value = this.textarea.value; - }else{ - this.editor.className='iceEditor'; - this.value = this.editor.innerHTML; - this.editor.innerHTML=''; - } - - //创建编辑器配置样式 - this.cssConfig = this.c('style'); - this.cssConfig.type='text/css'; - this.editor.appendChild(this.cssConfig); - - //创建编辑器菜单栏 - this.tool = this.c('div'); - this.tool.id=this.toolId; - this.tool.className='iceEditor-tool iceEditor-noselect'; - this.editor.appendChild(this.tool); - - //创建iframe - this.iframe = this.c('iframe'); - this.iframe.id=this.iframeId; - this.iframe.className='iceEditor-noselect'; - this.iframe.frameBorder=0; - this.editor.appendChild(this.iframe); - - //创建可拖拽层 - this.dragBg = this.c('div'); - this.dragBg.className='iceEditor-dragBg'; - this.editor.appendChild(this.dragBg); - - //创建编辑器的高度可拖拽容器 - this.drag = this.c('div'); - this.drag.id=this.dragId; - this.drag.className='iceEditor-drag iceEditor-noselect'; - this.drag.innerHTML=''; - this.editor.appendChild(this.drag); - - //编辑器拖拽增高 - this.drag.onmousedown=function(){ - _z.dragBg.style.display='block'; - var y = event.clientY; - var ch = _z.iframe.clientHeight; - window.onmousemove=function(){ - var h = event.clientY - y; - if(ch>=100){ - _z.iframe.height = ch + h + 'px'; - _z.height=ch + h + 'px'; - }else{ - _z.iframe.height = '100px'; - _z.height=ch + h + 'px'; - } - } - window.onmouseup = function(){window.onmousemove = null;window.onmouseup = null;_z.dragBg.style.display='none';} - } - - //创建禁用编辑器的遮罩 - this.disableds = this.c('div'); - this.disableds.className='iceEditor-disabled'; - this.editor.appendChild(this.disableds); - - //获取iframe对象 - this.w = this.iframe.contentWindow; //获取iframe Window 对象 - this.d = this.iframe.contentDocument; //获取iframe documen 对象 - - //为了兼容万恶的IE 创建iframe中的body - this.d.open(); - var value = this.value.trim(); - if(!value.length || value.substr(0,3) != '

    ') value = '

    '+this.value+'

    '; - this.d.write(''+value+''); - this.d.close(); - - // 设置元素为可编辑 - this.d.body.designMode = 'On'; //打开设计模式 - this.d.body.contentEditable = true;// 设置元素为可编辑 - this.d.body.addEventListener('click',function(){ - _z.parentTagName = _z.range.anchorNode.parentNode.tagName; - }) - - //内容区 - this.content = this.d.body; - - //改变textarea内容 - if(this.textarea){ - setInterval(function(){ - var html = _z.code?_z.html(_z.getHTML()):_z.getHTML(); - var c = _z.c('p'); //为了将pre标签内的
    改为换行符 - c.innerHTML = html; - var pre = c.getElementsByTagName('pre'); - for(var s=0;s/g,"\n"); - _z.textarea.innerHTML = _z.unhtml(c.innerHTML); - },1000); - } - - this.init(); //初始化参数 - this.create(); //创建编辑器 - this.paste(); //监听粘贴 -} -//光标控制器 -ice.editor.prototype={ - id:function(a){return document.getElementById(a)}, - c:function(a){return document.createElement(a)}, - //初始化参数 - init:function(){ - this.files=null; - this.insertImage=null; - this.element=this.d.body; - //this.element.focus(); //默认获取焦点 - this.range=this.d.createRange?this.w.getSelection():this.d.selection.createRange(); - }, - //dom后面插入节点 - insertAfter:function(n,obj){ - var parent = obj.parentNode; - if(parent.lastChild == obj){ - parent.appendChild(n,obj); - }else{ - parent.insertBefore(n,obj.nextSibling); - } - }, - //插入HTML - setHTML:function(html,a){ - this.element.focus(); - var range = this.range.getRangeAt(0); - //将选中的文档放在html中的DOM内 - if(!a)html.appendChild(range.extractContents()); - //删除选中的内容 - range.deleteContents(); - //创建文档碎片并放入新节点 - range.insertNode(this.w.document.createDocumentFragment().appendChild(html));//合并范围至末尾 - //合并范围至末尾 - range.collapse(false); - }, - //插入文字内容 - setText:function(text,a){ - this.element.focus(); - var range = this.range.getRangeAt(0); - range.deleteContents(); - var el = document.createElement('div'); - if(a){//是否为html - el.innerHTML = text; - }else{ - el.appendChild(document.createTextNode(text)); - } - var frag = document.createDocumentFragment(), node, lastNode; - while((node = el.firstChild)){ - lastNode = frag.appendChild(node); - } - range.insertNode(frag); - if(lastNode){ - range = range.cloneRange(); - range.setStartAfter(lastNode); - range.collapse(true); - this.range.removeAllRanges(); - this.range.addRange(range); - } - }, - //获取选中的HTML - getSelectHTML:function(){ - var p = this.c('p'); - p.appendChild(this.range.getRangeAt(0).cloneContents()); - return p.innerHTML; - }, - //获取选中的内容 - getSelectText:function(){ - if(this.range.toString()=='false' || this.range.toString()==''){ - return ''; - }else{ - return this.range.toString(); - } - }, - unhtml:function(str){ - var s = ''; - if (str.length == 0) return ''; - s = str.replace(/&/g, "&"); - s = s.replace(//g, ">"); - s = s.replace(/\'/g, "'"); - s = s.replace(/\"/g, """); - return s; - }, - html:function(str){ - var s = ''; - if (str.length == 0) return ''; - s = str.replace(/</g, "<"); - s = s.replace(/>/g, ">"); - s = s.replace(/'/g, "\'"); - s = s.replace(/"/g, "\""); - s = s.replace(/&/g, "&"); - return s; - }, - //转义:HTML转成字符串 - toText:function(html){ - var temp = this.c('div'); - (temp.textContent != null) ? (temp.textContent = html) : (temp.innerText = html); - var output = temp.innerHTML; - temp = null; - return output; - }, - //转义:字符串转成HTML - toHTML:function(text){ - var temp = this.c('div'); - temp.innerHTML = text; - var output = temp.innerText || temp.textContent; - temp = null; - return output; - }, - //判断祖先节点是否存在 - inNodeParent:function(el,parent) { - if(!el) return false; - if(el.parentNode){ - if(typeof parent == 'string'){ - parent = parent.toUpperCase(); - if(el.tagName == parent) return true; - return el.parentNode.tagName == parent ? true : this.inNodeParent(el.parentNode,parent); - }else{ - return el.parentNode == parent ? true : this.inNodeParent(el.parentNode,parent); - } - } - return false; - }, - //数组查询 - inArray:function(needle,array){ - if(typeof needle=='string'||typeof needle=='number'){ - for(var i in array)if(needle===array[i])return true; - return false; - } - }, - //弹窗 - popup:function(options){ - options = options || {}; - var width = options.width || '400'; //默认宽度 - var height = options.height || '200'; //默认高度 - var title = options.title || ''; //默认不显示标题 - var content = options.content || ''; //默认内容 - return '
    ' + title + '
    ' + content +'
    '; - }, - //获取对象距离窗口页面的顶部和左部的距离 - getCoords:function(el){ - var box = el.getBoundingClientRect(), - doc = el.ownerDocument, - body = doc.body, - html = doc.documentElement, - clientTop = html.clientTop || body.clientTop || 0, - clientLeft = html.clientLeft || body.clientLeft || 0, - top = box.top - clientTop, - left = box.left - clientLeft; - return { 'top': top, 'left': left }; - }, - //阻止冒泡 - pd:function(event){ - window.event ? window.event.cancelBubble = true : e.stopPropagation(); - }, - //是否为ie - isIE:function(){return !!window.ActiveXObject || "ActiveXObject" in window}, - //异步请求 - ajax:function(json){ - json = json || {}; - if (!json.url) return; - json.timeout = json.timeout || 15000; - json.data = json.data || {}; - - //创建 - var xhr = new XMLHttpRequest(); - //xhr.withCredentials = false; - //连接 和 发送 - 第二步 - - xhr.open('POST', json.url, true); - //设置表单提交时的内容类型 - xhr.setRequestHeader('X-Requested-With','XMLHttpRequest'); - //xhr.setRequestHeader('Content-Type', 'multipart/form-data'); - xhr.send(json.data); - - //接收 - 第三步 - json.loading && json.loading(); - json.timer = setTimeout(function() { - xhr.onreadystatechange = null; - json.error && json.error('网络超时。'); - }, json.timeout); - xhr.onreadystatechange = function() { - if (xhr.readyState == 4) { - clearTimeout(json.timer); - if (xhr.status >= 200 && xhr.status < 300 || xhr.status == 304) { - if(xhr.responseText.length>0){ - var res = JSON.parse(xhr.responseText); - }else{ - var res = ''; - } - json.success && json.success(res); - } else { - json.error && json.error(xhr.status); - } - } - }; - }, - //图片上传 - imagesUpload:function(){ - var _z = this; - var close = _z.insertImage.getElementsByClassName('iceEditor-popup')[0]; - //输入连接插入图片 - var url = _z.insertImage.getElementsByClassName('iceEditor-insertImageUrl')[0]; - var width = _z.insertImage.getElementsByClassName('iceEditor-inputWidth')[0]; - var height = _z.insertImage.getElementsByClassName('iceEditor-inputHeight')[0]; - var btn = _z.insertImage.getElementsByClassName('iceEditor-btn')[0]; - //绑定输入连接 - btn.onclick=function(){ - var img = _z.c('img'); - img.src = url.value; - img.width = width.value; - img.height = height.value; - _z.setHTML(img); - close.style.display='none'; - _z.pd(); - } - //上传图片 - _z.id(_z.imgUploadId).onchange=function(){ - if(!_z.uploadUrl) return alert('请配置uploadUrl项'); - console.log(this.files) - var formData = new FormData(); - for(var i=0;i1){ - id = id[0].split('video/'); - if(id.length>1 && id[1].length){ - v.src='https://player.bilibili.com/player.html?bvid='+id[1]; - }else{ - return alert('b站'+error); - } - }else{ - return alert('b站'+error); - } - }else if(type === 3){ //优酷 - //源地址:https://v.youku.com/v_show/id_XMjM0ODA3NjIw.html - //处理地址:https://player.youku.com/embed/XMjM0ODA3NjIw - var id = url.value.split('.html'); - if(id.length>1){ - id = id[0].split('id_'); - if(id.length>1 && id[1].length){ - v.src='https://player.youku.com/embed/'+id[1]; - }else{ - return alert('优酷:'+error); - } - }else{ - return alert('优酷:'+error); - } - } - } - _z.setHTML(v,true); - close.style.display='none'; - _z.pd(); - } - }, - //创建菜单 - createMenu:function(json){ - var _z = this; - var li = this.c('li'); - if(json.id)li.id = json.id; - if(json.css)li.className = json.css; - if(json.style)this.css += json.style; - //将菜单设置成文字或者图标 - if(json.menu || json.icon){ - var div = this.c('div'); - div.className='iceEditor-exec'; - if(json.menu){ - div.innerHTML = json.menu; - }else{ - if(json.icon)div.innerHTML = ''; - } - if(json.data)div.setAttribute('data',json.data); - li.appendChild(div); - } - //使用下拉菜单 - if(json.dropdown){ - var div = this.c('div'); - div.className='iceEditor-menuDropdown'; - div.innerHTML = json.dropdown; - li.appendChild(div); - li.openMenu = 1; - li.onmouseover = function(){ - if(li.openMenu)div.className = 'iceEditor-menuDropdown iceEditor-menuActive'; - } - li.onmouseout = function(){ - div.className = 'iceEditor-menuDropdown'; - } - var exec = div.getElementsByClassName('iceEditor-exec'); - for(var i=0;i
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 文字大小
  • '}); - - //文字背景颜色 - var html='
      '; - for(var i=0;i'; - } - html+='
    • 文字背景颜色
    '; - this.createMenu({name:'backColor',icon:'backColor',dropdown:html}); - - //文字颜色 - var html='
      '; - for(var i=0;i'; - } - html+='
    • 文字颜色
    '; - this.createMenu({name:'foreColor',icon:'foreColor',dropdown:html}); - - //加粗 - this.createMenu({name:'bold',data:'bold',icon:'bold'}); - //倾斜 - this.createMenu({name:'italic',data:'italic',icon:'italic'}); - //下划线 - this.createMenu({name:'underline',data:'underline',icon:'underline'}); - //删除线 - this.createMenu({name:'strikeThrough',data:'strikeThrough',icon:'strike'}); - //左对齐 - this.createMenu({name:'justifyLeft',data:'justifyLeft',icon:'alignleft'}); - //居中对齐 - this.createMenu({name:'justifyCenter',data:'justifyCenter',icon:'aligncenter'}); - //右对齐 - this.createMenu({name:'justifyRight',data:'justifyRight',icon:'alignright'}); - //缩进 - this.createMenu({name:'indent',data:'indent',icon:'indent'}); - //取消缩进 - this.createMenu({name:'outdent',data:'outdent',icon:'outdent'}); - //有序列表 - this.createMenu({name:'insertOrderedList',data:'insertOrderedList',icon:'orderedlist'}); - //无序列表 - this.createMenu({name:'insertUnorderedList',data:'insertUnorderedList',icon:'unorderedlist'}); - //下标 - this.createMenu({name:'subscript',data:'subscript',icon:'subscript'}); - //上标 - this.createMenu({name:'superscript',data:'superscript',icon:'superscript'}); - //取消连接 - this.createMenu({name:'unlink',data:'unlink',icon:'unlink'}); - //添加水平线 - this.createMenu({name:'hr',data:'insertHorizontalRule',icon:'min'}); - //清除格式 - this.createMenu({name:'removeFormat',data:'removeFormat',icon:'remove'}); - //全选 - this.createMenu({name:'selectAll',data:'selectAll',icon:'empty'}); - //查看源码 - this.createMenu({name:'code',icon:'code',data:'code'}); - //隔线 - this.createMenu({name:'line',css:'line'}); - //表格 - this.createMenu({name:'table',icon:'table',dropdown:'
    • 表格:1×1
    '}); - //创建连接 - this.createMenu({name:'createLink',icon:'link',id:this.linkId,popup:{width:380,height:110,title:'添加链接',content:''}}); - //音乐 - this.createMenu({name:'music',icon:'music',id:this.musicId,popup:{width:380,height:80,title:'添加音乐',content:'
    音乐链接:确定
    '}}); - //附件 - this.createMenu({name:'files',icon:'files',id:this.filesId,popup:{width:450,height:250,title:'附件上传',content:'
    '}}); - - //添加图片 - this.createMenu({name:'insertImage',icon:'pic',id:this.imageId,popup:{width:450,height:250,title:'图片上传',content:'
    URL:宽:高:确定
    '}}); - //添加视频 - this.createMenu({name:'video',icon:'video',id:this.videoId,popup:{width:450,height:170,title:'添加视频',content:'
    URL:
    宽:高:确定
    '}}); - //窗口最大化 - this.createMenu({name:'max',icon:'max',data:'max',css:'iceEditor-maxWindow'}); - //窗口最小化 - this.createMenu({name:'min',icon:'min',data:'min',css:'iceEditor-minWindow'}); - //菜单栏禁止 - this.createMenu({name:'disabled',css:'iceEditor-disabledMask'}); -}; -//格式化菜单栏 -ice.editor.prototype.menuFormat=function() { - var _z=this; - this.menuHTML(); - var ul = this.c('ul'); - ul.className='iceEditor-menu'; - for(var i=0;i]+>/ig,'').replace(/<\s*\/a\s*>/ig,''); - var a = _z.c('a'); - if(_z.link.getElementsByTagName('input')[1].checked) a.target='_blank'; - a.href = _z.linkInput.value; - a.innerHTML = str; - _z.setHTML(a,true); - _z.link.getElementsByClassName('iceEditor-popup')[0].style.display='none'; - _z.pd(); - } - } - //添加音乐 - if(this.inArray('music',this.menu)){ - this.music = this.id(this.musicId); - this.musicInput = this.id(this.musicInputId); - _z.music.getElementsByClassName('iceEditor-btn')[0].onclick = function(){ - var a = _z.c('audio'); - a.src=_z.musicInput.value; - a.controls='controls'; - _z.setHTML(a,true); - _z.music.getElementsByClassName('iceEditor-popup')[0].style.display='none'; - _z.pd(); - } - } - if(this.inArray('video',this.menu)){ - this.video = this.id(this.videoId); - this.addVideo(); - } - if(this.inArray('files',this.menu)){ - this.files = this.id(this.filesId); - this.filesUpload(); - } - if(this.inArray('insertImage',this.menu)){ - this.insertImage = this.id(this.imageId); - this.imagesUpload(); - } - if(this.inArray('table',this.menu)){ - //表格 - this.table = this.id(this.tableId); - var tableBox = this.table.getElementsByClassName('iceEditor-tableBox')[0]; - var tableBgOn = this.table.getElementsByClassName('iceEditor-tableBgOn')[0]; - var tableNum = this.table.getElementsByClassName('iceEditor-tableNum')[0]; - tableBox.onmouseover=function(ev){ - var o = _z.getCoords(this),r=1,c=1; - this.onmousemove=function(ev){ - var Event = ev || event; - var x = Event.clientX - o.left - 5; - var y = Event.clientY - o.top - 5; - if(x<=180 && y<=180){ - r = Math.ceil(x/18); - c = Math.ceil(y/18); - tableBgOn.style.width = r*18 + 'px'; - tableBgOn.style.height = c*18 + 'px'; - tableNum.innerHTML='表格:'+r+"×"+c - } - } - this.onmousedown=function(){ - var tableNode=_z.c('table'); - tableNode.width='100%'; - tableNode.border=1; - tableNode.style.border='1px solid #bdbdbd'; - tableNode.style.borderSpacing=0; - tableNode.style.borderCollapse='collapse'; - tableNode.className='table table-border'; - for(var x=0;x"); - }else{ - _z.tool.className='iceEditor-tool iceEditor-noselect'; - d.style.display='block'; - this.className='iceEditor-exec iceEditor-active'; - _z.code=1; - _z.d.body.className='iceEditor-code'; - var pre = _z.d.body.getElementsByTagName('pre'); - //处理pre标签 - for(var s=0;s/g,"\n"); - var text = _z.getHTML(); - //格式化段落 - text = text.replace(/<\/p>

    /gim,"<\/p>\n

    ").replace(/>

    \n\n<");
    -						_z.d.body.innerHTML=_z.unhtml(text);
    -						
    -					}
    -					break;
    -					//最大化
    -					case 'max':
    -					var webHeight = window.innerHeight; //页面视口高度
    -					if (typeof webHeight != 'number') {
    -						if (document.compatMode == 'CSS1Compat') {
    -							webHeight = document.documentElement.clientHeight;
    -						} else {
    -							webWidth = document.body.clientWidth;
    -						}
    -					}
    -					_z.editor.style.position='fixed';
    -					_z.editor.style.zIndex=_z.getTime;
    -					_z.editor.style.width='100%';
    -					_z.editor.style.height='100%';
    -					_z.editor.style.top=0;
    -					_z.editor.style.left=0;
    -					_z.iframe.height=webHeight-35-20+'px';
    -					this.parentNode.style.display='none';
    -					_z.tool.getElementsByClassName('iceEditor-minWindow')[0].style.display='block';
    -					break;
    -					//最小化
    -					case 'min':
    -					_z.editor.removeAttribute('style');
    -					_z.iframe.height=_z.height;
    -					this.parentNode.style.display='none';
    -					_z.tool.getElementsByClassName('iceEditor-maxWindow')[0].style.display='block';
    -					break;
    -					//默认执行execCommand
    -					default:
    -					var b = this.attr.split('|');
    -					if(b.length>1){
    -						_z.w.document.execCommand(b[0], false, b[1]);
    -					}else{
    -						_z.w.document.execCommand(b[0], false, null);
    -					}
    -					_z.range.getRangeAt(0).collapse();
    -				}
    -				return false;
    -			}
    -		}
    -	}
    -};
    -//纯文本粘贴
    -ice.editor.prototype.paste=function(){
    -	var _z=this;
    -	var upload = function(imgBase64){
    -		//如果禁用上传到服务期,则直接以base64格式显示图像
    -		if(!_z.screenshotUpload){
    -			var p = _z.c('p');
    -			var a = _z.c('img');
    -			a.src = imgBase64;
    -			p.appendChild(a);
    -			_z.setHTML(p,true);
    -			return;
    -		}
    -		function dataURItoBlob(base64Data) {
    -			var byteString;
    -			if (base64Data.split(',')[0].indexOf('base64') >= 0){
    -				byteString = atob(base64Data.split(',')[1]);
    -			}else{
    -				byteString = unescape(base64Data.split(',')[1]);
    -			}
    -			var mimeString = base64Data.split(',')[0].split(':')[1].split(';')[0];
    -			var a = new Uint8Array(byteString.length);
    -			for (var i = 0; i < byteString.length; i++) {
    -				a[i] = byteString.charCodeAt(i);
    -			}
    -			return new Blob([a], {type:mimeString});
    -		}
    -		var blob = dataURItoBlob(imgBase64);
    -		var formData = new FormData();
    -		formData.append('file[]', blob);
    -		_z.ajax({
    -			url:_z.uploadUrl,
    -			data: formData,
    -			success: function (res) {
    -				if(res){
    -					for(var f=0;f'),true);
    -			return;
    -		}
    -		//以换行方式分割容
    -		var t = text.split('\n');
    -		if(t.length==1){
    -			_z.setText(text);
    -			return;
    -		}
    -		for(var i=0;i
    ':'
    '; - var range = _z.range.getRangeAt(0); - range.insertNode(range.createContextualFragment(br)); - //接下来这一步是为了修正光标位置 - var node = _z.range.anchorNode.nextSibling.nextSibling; - range.setStart(node,0); - range.setEnd(node,0); - range.collapse(); - }else if(_z.parentTagName == 'PRE' || _z.range.anchorNode.tagName == 'PRE'){ - _z.setText('
    ',true); - } - e.preventDefault(); - return; - } - } - // 去除Crtl+b/Ctrl+i/Ctrl+u等快捷键 - // e.metaKey for mac - if (e.ctrlKey || e.metaKey) { - switch(e.keyCode){ - case 13:{console.log(1);e.preventDefault();break;} - case 66: //ctrl+B or ctrl+b - case 98: - case 73: //ctrl+I or ctrl+i - case 105: - case 85: //ctrl+U or ctrl+u - case 117: {e.preventDefault();break;} - } - } - }); -}; -//配置格式化 -ice.editor.prototype.create=function() { - //添加样式 - if(this.cssConfig.styleSheet){ - this.cssConfig.styleSheet.cssText=this.css; - }else{ - this.cssConfig.innerHTML=this.css; - } - this.menuFormat(); - this.menuAction(); - this.disableds.style.display = this.disabled?'block':'none'; -}; -//获取编辑器的HTML内容 -ice.editor.prototype.getHTML=function() { - return this.content.innerHTML; -}; -//获取编辑器的Text内容 -ice.editor.prototype.getText=function() { - return this.content.innerText; -}; -//设置编辑器的内容 -ice.editor.prototype.setValue=function(v) { - this.content.innerHTML=v; -}; -//追加编辑器的内容 -ice.editor.prototype.addValue=function(v) { - this.content.innerHTML+=v; -}; -//编辑器图标 -ice.editor.css='.iceEditor{color:#353535;font-family:"Microsoft YaHei";font-size:14px;background:#fff;position:relative;border:solid 1px #ccc}.iceEditor *{margin:0;padding:0;box-sizing:border-box}.iceEditor a{color:#606060;text-decoration:none;-webkit-tap-highlight-color:transparent}.iceEditor a:hover{color:#000}.iceEditor input{height:27px;line-height:27px;padding:3px;border:1px solid #B7B7B7;font-family:inherit;font-size:inherit;vertical-align:middle;outline:none}.iceEditor-exec{cursor:pointer}.iceEditor-icon{width:16px;height:16px;fill:currentColor;overflow:hidden;vertical-align:middle;font-size:16px}.iceEditor-noselect{-webkit-touch-callout:none;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.iceEditor-menuDropdown{min-width:35px;min-height:35px;transition:all .4s ease;top:50px;opacity:0;visibility:hidden;position:absolute;background:#fff;z-index:999;box-shadow:0 2px 9px 0 rgba(0,0,0,.2);border-bottom:2px solid #676767;border-top:1px solid #676767}.iceEditor-menuDropdown::before{content:"";display:block;width:0;height:0;border-left:8px solid transparent;border-right:8px solid transparent;border-bottom:8px solid #676767;position:absolute;top:-8px;left:9px}.iceEditor-menuTitle{width:100%!important;text-align:center;height:30px;line-height:30px;border-top:1px solid #efefef}.iceEditor-tool{width:100%;background:#eee;border-bottom:solid 1px #ccc;position:relative}.iceEditor-tool:after,.iceEditor-tool:before{display:table;content:" "}.iceEditor-tool:after{clear:both}.iceEditor-menu{width:100%;padding:0 10px;display:inline-block;float:left}.iceEditor-menu a{list-style:none;float:left;min-width:35px;height:35px;padding:0 5px;text-align:center;line-height:35px;cursor:pointer}.iceEditor-menu a:hover{background:#cdcdcd}.iceEditor-menu>li>div.iceEditor-exec{list-style:none;float:left;min-width:35px;height:35px;padding:0 5px;text-align:center;line-height:35px;cursor:pointer}.iceEditor-menu>li>div.iceEditor-exec:hover{background:#cdcdcd}.iceEditor-menu svg{fill:currentColor;overflow:hidden;vertical-align:middle;font-size:16px}.iceEditor-menu .iceEditor-active{background:#e0e0e0;position:relative;z-index:999}.iceEditor-menu .iceEditor-disabledMask{background:rgba(238,238,238,0.7);width:100%;height:100%;position:absolute;left:0;top:0;display:none}.iceEditor-menu li{display:inline-block;float:left}.iceEditor-menu li .iceEditor-menuDropdown.iceEditor-menuActive{top:44px;opacity:1;visibility:visible}.iceEditor-menu li.iceEditor-minWindow{display:none}.iceEditor-menu li.iceEditor-maxWindow,.iceEditor-menu li.iceEditor-minWindow{float:right}.iceEditor-menu li.iceEditor-maxWindow>div,.iceEditor-menu li.iceEditor-minWindow>div{position:relative;z-index:999}.iceEditor-menu li.iceEditor-maxWindow .iceEditor-icon,.iceEditor-menu li.iceEditor-minWindow .iceEditor-icon{color:#606060}.iceEditor-codeLanguages select{padding:5px 5px;width:120px;outline:none;font-size:15px;margin-top:10px;}.iceEditor-line{height:35px;border-right:1px solid #ccc;width:1px;margin:0 10px;vertical-align:middle}.iceEditor-uploadInput{display:none}.iceEditor-uploadBtn{float:none;width:auto;font-size:15px;background:#00b7ee;height:40px;line-height:40px;padding:0 30px;color:#fff;display:inline-block;margin:0 auto 15px auto;cursor:pointer;box-shadow:0 1px 1px rgba(0,0,0,.1)}.iceEditor-uploadBtn:hover{background:#009ccb}.iceEditor-uploadIcon{width:45px;height:45px;color:#bababa;margin:45px 20px 10px}.iceEditor-backColor{width:230px;padding:5px}.iceEditor-backColor span{width:20px;height:20px;padding:0;margin:1px;display:inline-block}.iceEditor-fontSize{width:280px}.iceEditor-fontSize li{width:40px;text-align:center}.iceEditor-fontSize span{width:40px;display:inline-block;padding:10px 0}.iceEditor-fontSize span:hover{background:#eee;color:#4CAF50}.iceEditor-createLink label{margin-top:10px;display:inline-block;}.iceEditor-link{width:230px;}.iceEditor-popup .iceEditor-insertImage{text-align:center}.iceEditor-popup .iceEditor-insertImageUrl{width:140px;height:27px;outline:0;margin-right:15px}.iceEditor-popup .iceEditor-inputWidth{width:50px;height:27px;outline:0;margin-right:15px}.iceEditor-popup .iceEditor-inputHeight{width:50px;height:27px;outline:0}.iceEditor-popup .iceEditor-btn{width:auto;display:inline-block;float:none;color:#fff!important;height:27px;line-height:25px;padding:0 10px;background:#939393;vertical-align:middle;margin-left:5px;border:1px solid #7b7b7b}.iceEditor-popup .iceEditor-btn:hover{background:#7b7b7b!important;color:#fff}.iceEditor-tableBox{position:relative;width:190px;height:214px;padding:5px;overflow:hidden}.iceEditor-tableBgOn{position:absolute!important;top:5px;left:5px;z-index:4;width:18px;height:18px;background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABIAAAASAgMAAAAroGbEAAAACVBMVEUAAIjd6vvD2f9LKLW+AAAAAXRSTlMAQObYZgAAAAFiS0dEAIgFHUgAAAAJcEhZcwAACxMAAAsTAQCanBgAAAAHdElNRQfYAR0BKwNDEVT0AAAAG0lEQVQI12NgAAOtVatWMTCohoaGUY+EmIkEAEruEzK2J7tvAAAAAElFTkSuQmCC) repeat}.iceEditor-tableBgOff{width:180px;height:180px;background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABIAAAASAgMAAAAroGbEAAAACVBMVEUAAIj4+Pjp6ekKlAqjAAAAAXRSTlMAQObYZgAAAAFiS0dEAIgFHUgAAAAJcEhZcwAACxMAAAsTAQCanBgAAAAHdElNRQfYAR0BKhmnaJzPAAAAG0lEQVQI12NgAAOtVatWMTCohoaGUY+EmIkEAEruEzK2J7tvAAAAAElFTkSuQmCC) repeat}.iceEditor-tableNum{height:30px;line-height:30px;text-align:center;color:#757575}.iceEditor-video{text-align:left}.iceEditor-video label{margin-right:20px;display:inline-block}.iceEditor-video input{margin-right:5px}.iceEditor-video div{height:27px;margin-bottom:10px}.iceEditor-popup .iceEditor-videoUrl{width:380px;height:27px;outline:0;margin-right:0}.iceEditor-content{width:100%;height:100%;padding:20px;position:relative}.iceEditor-content:focus{outline:0}.iceEditor-dragBg{position:absolute;width:100%;height:100%;top:0;left:0;z-index:1;display:none;}.iceEditor-drag{color:#757575;background:#eee;text-align:center;height:12px;line-height:0;cursor:n-resize}.iceEditor-disabled{position:absolute;width:100%;height:100%;top:0;left:0;background:rgba(191,191,191,.79);z-index:99999;display:none}.iceEditor-popup{display:none}.iceEditor-popupMain{width:400px;height:200px;position:fixed;margin:auto;top:0;bottom:0;left:0;right:0;background:#fff;box-shadow:0 1px 1px rgba(0,0,0,.12);z-index:2;animation-name:iceEditorPopup;animation-duration:.5s}.iceEditor-popupBox{width:100%;height:100%;position:fixed;top:0;left:0;background:rgba(0,0,0,.33);opacity:.5;filter:alpha(opacity=50);z-index:1}.iceEditor-popupTitle{width:100%;height:30px;line-height:30px;background:#2f2f2f;padding:0 10px;color:#fff}.iceEditor-popupTitle span{display:inline-block;vertical-align:middle}.iceEditor-popupTitle::before{content:"";display:inline-block;width:10px;height:10px;border-radius:10px;background:#c7f98c;vertical-align:middle;margin-right:8px}.iceEditor-popupClose{float:right;padding:0 10px;color:#fff;font-size:18px;cursor:pointer}.iceEditor-popupClose:hover{color:#8fe5ff}.iceEditor-popupContent{width:100%;padding:10px;color:#000;overflow:auto;float:left}.iceEditor-popupBtn{width:100%;border:0;color:#fff;background:#03A9F4;border-top:1px solid #efefef;padding:0 20px;margin:0;height:35px;text-align:center;line-height:35px;cursor:pointer;margin-top:20px;outline:0}.iceEditor-popupBtn:hover{color:#151515;background:#efefef}@keyframes iceEditorPopup{0%{top:-100px;opacity:0}to{top:0;opacity:1}}@media (max-width:768px){.iceEditor-menu .iceEditor-line{display:none}.iceEditor-popupMain{margin:0!important;width:90%!important;height:90%!important;top:5%!important;left:5%!important}@keyframes iceEditorPopup{0%{margin-top:-50px}to{margin-top:0}}}'; -//编辑器图标 -ice.editor.svg = ''; +/** + +------------------------------------------------------------------------------------+ + + iceEditor(富文本编辑器) + +------------------------------------------------------------------------------------+ + + iceEditor v1.1.6 + * MIT License By www.iceui.net + + 作者:ice + + 官方:www.iceui.net + + 时间:2020-06-20 + +------------------------------------------------------------------------------------+ + + 版权声明:该版权完全归iceUI官方所有,可转载使用和学习,但请务必保留版权信息 + +------------------------------------------------------------------------------------+ + + iceEditor是一款简约风格的富文本编辑器,体型十分娇小,无任何依赖,整个编辑器只有一个 + + 文件,功能却很不平凡!简约的唯美设计,简洁、极速、使用它的时候不需要引用jQuery、font + + css……等文件,因为整个编辑器只是一个Js,支持上传图片、附件!支持添加音乐、视频! + +------------------------------------------------------------------------------------+ +*/ +'use strict'; +var ice = ice || {}; +ice.editor = function(id){ + + //------------------------参数配置 开始------------------------ + // 工具栏菜单 + this.menu=[ + 'backColor','fontSize','foreColor','bold','italic','underline','strikeThrough','line','justifyLeft', + 'justifyCenter','justifyRight','indent','outdent','line','insertOrderedList','insertUnorderedList','line','superscript', + 'subscript','createLink','unlink','line','hr','table','files','music','video','insertImage', + 'removeFormat','line','code' + ]; + // 文字背景颜色 + this.backColor = [ + '#ffffff','#000000','#eeece1','#1f497d','#4f81bd','#c0504d','#9bbb59','#8064a2','#4bacc6','#f79646', + '#f2f2f2','#979797','#ddd9c3','#c6d9f0','#dbe5f1','#f2dcdb','#ebf1dd','#e5e0ec','#dbeef3','#fdeada', + '#d8d8d8','#595959','#c4bd97','#8db3e2','#b8cce4','#e5b9b7','#d7e3bc','#ccc1d9','#b7dde8','#fbd5b5', + '#bfbfbf','#3f3f3f','#938953','#548dd4','#95b3d7','#d99694','#c3d69b','#b2a2c7','#92cddc','#fac08f', + '#a5a5a5','#262626','#494429','#17365d','#366092','#953734','#76923c','#5f497a','#31859b','#e36c09', + '#7f7f7f','#0c0c0c','#1d1b10','#0f243e','#244061','#632423','#4f6128','#3f3151','#205867','#974806', + '#c00000','#ff0000','#ffc000','#ffff00','#92d050','#00b050','#00b0f0','#0070c0','#002060','#7030a0' + ]; + //文字颜色 + this.foreColor = this.backColor; + //编辑器的尺寸 + this.width='100%'; + this.height='400px'; + //查看源码 + this.code=0; + //窗口最大化和最小化 + this.maxWindow=1; + //编辑器禁用 + this.disabled=0; + //编辑器样式 + this.css = ''; + //图片和附件提交地址 + this.uploadUrl=0; + //截图粘贴启用 + this.screenshot=1; + //截图粘贴直接上传到服务期 + this.screenshotUpload=1; + //HTML标签过滤黑名单-忽略粘贴过来的HTML标签 + this.htmlTag=['meta','style','script','object','form','iframe']; + //HTML标签 将该块级元素标签同意格式化为p标签 + this.formatTag=['address','caption','dd','div','dl','dt','fieldset','h1','h2','h3','h4','h5','h6','legend','fieldset','li','noframes','noscript','ol','ul','p','pre','table','tbody','tfoot','th','thead','tr']; + //------------------------参数配置 结束------------------------ + //构建功能模块唯一id + this.getTime ='1'+ String(new Date().getTime()).substr(4,8); + this.iframeId = '_iframe'+this.getTime; + this.toolId = '_tool'+this.getTime; + this.linkId = '_link'+this.getTime; + this.linkInputId = '_LinkInput'+this.getTime; + this.musicId = '_music'+this.getTime; + this.musicInputId = '_musicInput'+this.getTime; + this.videoId = '_video'+this.getTime; + this.imageId = '_image'+this.getTime; + this.imgUploadId = '_imgUpload'+this.getTime; + this.filesId = '_files'+this.getTime; + this.filesUploadId = '_filesUpload'+this.getTime; + this.tableId = '_table'+this.getTime; + this.dragId = '_drag'+this.getTime; + + //菜单列表对象 + this.menuList={}; + + //获取编辑器对象 + var _z=this; + this.editor = this.id(id); + if(!this.editor) return alert('请提供一个有效的id'); + this.textarea = 0; + // 只能是 textarea 和 div ,其他类型的元素不行 + if (this.editor.nodeName !== 'TEXTAREA' && this.editor.nodeName !== 'DIV') { + return console.log('暂不支持该标签-->'+this.editor.nodeName+' 推荐使用div'); + } + if(this.editor.nodeName == 'TEXTAREA'){ + this.editor.style.display='none'; + this.divId = '_div'+this.getTime; + var div = this.c('div'); + div.className='iceEditor'; + div.id=this.divId; + this.insertAfter(div,this.editor); + + //加载编辑器的内容 + this.textarea = this.editor; + this.editor = this.id(this.divId); + this.value = this.textarea.value; + }else{ + this.editor.className='iceEditor'; + this.value = this.editor.innerHTML; + this.editor.innerHTML=''; + } + + //创建编辑器配置样式 + this.cssConfig = this.c('style'); + this.cssConfig.type='text/css'; + this.editor.appendChild(this.cssConfig); + + //创建编辑器菜单栏 + this.tool = this.c('div'); + this.tool.id=this.toolId; + this.tool.className='iceEditor-tool iceEditor-noselect'; + this.editor.appendChild(this.tool); + + //创建iframe + this.iframe = this.c('iframe'); + this.iframe.id=this.iframeId; + this.iframe.className='iceEditor-noselect'; + this.iframe.frameBorder=0; + this.editor.appendChild(this.iframe); + + //创建可拖拽层 + this.dragBg = this.c('div'); + this.dragBg.className='iceEditor-dragBg'; + this.editor.appendChild(this.dragBg); + + //创建编辑器的高度可拖拽容器 + this.drag = this.c('div'); + this.drag.id=this.dragId; + this.drag.className='iceEditor-drag iceEditor-noselect'; + this.drag.innerHTML=''; + this.editor.appendChild(this.drag); + + //编辑器拖拽增高 + this.drag.onmousedown=function(){ + _z.dragBg.style.display='block'; + var y = event.clientY; + var ch = _z.iframe.clientHeight; + window.onmousemove=function(){ + var h = event.clientY - y; + if(ch>=100){ + _z.iframe.height = ch + h + 'px'; + _z.height=ch + h + 'px'; + }else{ + _z.iframe.height = '100px'; + _z.height=ch + h + 'px'; + } + } + window.onmouseup = function(){window.onmousemove = null;window.onmouseup = null;_z.dragBg.style.display='none';} + } + + //创建禁用编辑器的遮罩 + this.disableds = this.c('div'); + this.disableds.className='iceEditor-disabled'; + this.editor.appendChild(this.disableds); + + //获取iframe对象 + this.w = this.iframe.contentWindow; //获取iframe Window 对象 + this.d = this.iframe.contentDocument; //获取iframe documen 对象 + + //为了兼容万恶的IE 创建iframe中的body + this.d.open(); + var value = this.value.trim(); + if(!value.length || value.substr(0,3) != '

    ') value = '

    '+this.value+'

    '; + this.d.write(''+value+''); + this.d.close(); + + // 设置元素为可编辑 + this.d.body.designMode = 'On'; //打开设计模式 + this.d.body.contentEditable = true;// 设置元素为可编辑 + this.d.body.addEventListener('click',function(){ + _z.parentTagName = _z.range.anchorNode.parentNode.tagName; + }) + + //内容区 + this.content = this.d.body; + + //改变textarea内容 + if(this.textarea){ + setInterval(function(){ + var html = _z.code?_z.html(_z.getHTML()):_z.getHTML(); + var c = _z.c('p'); //为了将pre标签内的
    改为换行符 + c.innerHTML = html; + var pre = c.getElementsByTagName('pre'); + for(var s=0;s/g,"\n"); + _z.textarea.innerHTML = _z.unhtml(c.innerHTML); + },1000); + } + + this.init(); //初始化参数 + this.create(); //创建编辑器 + this.paste(); //监听粘贴 +} +//光标控制器 +ice.editor.prototype={ + id:function(a){return document.getElementById(a)}, + c:function(a){return document.createElement(a)}, + //初始化参数 + init:function(){ + this.files=null; + this.insertImage=null; + this.element=this.d.body; + //this.element.focus(); //默认获取焦点 + this.range=this.d.createRange?this.w.getSelection():this.d.selection.createRange(); + }, + //dom后面插入节点 + insertAfter:function(n,obj){ + var parent = obj.parentNode; + if(parent.lastChild == obj){ + parent.appendChild(n,obj); + }else{ + parent.insertBefore(n,obj.nextSibling); + } + }, + //插入HTML + setHTML:function(html,a){ + this.element.focus(); + var range = this.range.getRangeAt(0); + //将选中的文档放在html中的DOM内 + if(!a)html.appendChild(range.extractContents()); + //删除选中的内容 + range.deleteContents(); + //创建文档碎片并放入新节点 + range.insertNode(this.w.document.createDocumentFragment().appendChild(html));//合并范围至末尾 + //合并范围至末尾 + range.collapse(false); + }, + //插入文字内容 + setText:function(text,a){ + this.element.focus(); + var range = this.range.getRangeAt(0); + range.deleteContents(); + var el = document.createElement('div'); + if(a){//是否为html + el.innerHTML = text; + }else{ + el.appendChild(document.createTextNode(text)); + } + var frag = document.createDocumentFragment(), node, lastNode; + while((node = el.firstChild)){ + lastNode = frag.appendChild(node); + } + range.insertNode(frag); + if(lastNode){ + range = range.cloneRange(); + range.setStartAfter(lastNode); + range.collapse(true); + this.range.removeAllRanges(); + this.range.addRange(range); + } + }, + //获取选中的HTML + getSelectHTML:function(){ + var p = this.c('p'); + p.appendChild(this.range.getRangeAt(0).cloneContents()); + return p.innerHTML; + }, + //获取选中的内容 + getSelectText:function(){ + if(this.range.toString()=='false' || this.range.toString()==''){ + return ''; + }else{ + return this.range.toString(); + } + }, + unhtml:function(str){ + var s = ''; + if (str.length == 0) return ''; + s = str.replace(/&/g, "&"); + s = s.replace(//g, ">"); + s = s.replace(/\'/g, "'"); + s = s.replace(/\"/g, """); + return s; + }, + html:function(str){ + var s = ''; + if (str.length == 0) return ''; + s = str.replace(/</g, "<"); + s = s.replace(/>/g, ">"); + s = s.replace(/'/g, "\'"); + s = s.replace(/"/g, "\""); + s = s.replace(/&/g, "&"); + return s; + }, + //转义:HTML转成字符串 + toText:function(html){ + var temp = this.c('div'); + (temp.textContent != null) ? (temp.textContent = html) : (temp.innerText = html); + var output = temp.innerHTML; + temp = null; + return output; + }, + //转义:字符串转成HTML + toHTML:function(text){ + var temp = this.c('div'); + temp.innerHTML = text; + var output = temp.innerText || temp.textContent; + temp = null; + return output; + }, + //判断祖先节点是否存在 + inNodeParent:function(el,parent) { + if(!el) return false; + if(el.parentNode){ + if(typeof parent == 'string'){ + parent = parent.toUpperCase(); + if(el.tagName == parent) return true; + return el.parentNode.tagName == parent ? true : this.inNodeParent(el.parentNode,parent); + }else{ + return el.parentNode == parent ? true : this.inNodeParent(el.parentNode,parent); + } + } + return false; + }, + //数组查询 + inArray:function(needle,array){ + if(typeof needle=='string'||typeof needle=='number'){ + for(var i in array)if(needle===array[i])return true; + return false; + } + }, + //弹窗 + popup:function(options){ + options = options || {}; + var width = options.width || '400'; //默认宽度 + var height = options.height || '200'; //默认高度 + var title = options.title || ''; //默认不显示标题 + var content = options.content || ''; //默认内容 + return '
    ' + title + '
    ' + content +'
    '; + }, + //获取对象距离窗口页面的顶部和左部的距离 + getCoords:function(el){ + var box = el.getBoundingClientRect(), + doc = el.ownerDocument, + body = doc.body, + html = doc.documentElement, + clientTop = html.clientTop || body.clientTop || 0, + clientLeft = html.clientLeft || body.clientLeft || 0, + top = box.top - clientTop, + left = box.left - clientLeft; + return { 'top': top, 'left': left }; + }, + //阻止冒泡 + pd:function(event){ + window.event ? window.event.cancelBubble = true : e.stopPropagation(); + }, + //是否为ie + isIE:function(){return !!window.ActiveXObject || "ActiveXObject" in window}, + //异步请求 + ajax:function(json){ + json = json || {}; + if (!json.url) return; + json.timeout = json.timeout || 15000; + json.data = json.data || {}; + + //创建 + var xhr = new XMLHttpRequest(); + //xhr.withCredentials = false; + //连接 和 发送 - 第二步 + + xhr.open('POST', json.url, true); + //设置表单提交时的内容类型 + xhr.setRequestHeader('X-Requested-With','XMLHttpRequest'); + //xhr.setRequestHeader('Content-Type', 'multipart/form-data'); + xhr.send(json.data); + + //接收 - 第三步 + json.loading && json.loading(); + json.timer = setTimeout(function() { + xhr.onreadystatechange = null; + json.error && json.error('网络超时。'); + }, json.timeout); + xhr.onreadystatechange = function() { + if (xhr.readyState == 4) { + clearTimeout(json.timer); + if (xhr.status >= 200 && xhr.status < 300 || xhr.status == 304) { + if(xhr.responseText.length>0){ + var res = JSON.parse(xhr.responseText); + }else{ + var res = ''; + } + json.success && json.success(res); + } else { + json.error && json.error(xhr.status); + } + } + }; + }, + //图片上传 + imagesUpload:function(){ + var _z = this; + var close = _z.insertImage.getElementsByClassName('iceEditor-popup')[0]; + //输入连接插入图片 + var url = _z.insertImage.getElementsByClassName('iceEditor-insertImageUrl')[0]; + var width = _z.insertImage.getElementsByClassName('iceEditor-inputWidth')[0]; + var height = _z.insertImage.getElementsByClassName('iceEditor-inputHeight')[0]; + var btn = _z.insertImage.getElementsByClassName('iceEditor-btn')[0]; + //绑定输入连接 + btn.onclick=function(){ + var img = _z.c('img'); + img.src = url.value; + if(width.value.trim())img.width = width.value.trim(); + if(height.value.trim())img.height = height.value.trim(); + _z.setHTML(img); + close.style.display='none'; + _z.pd(); + } + //上传图片 + _z.id(_z.imgUploadId).onchange=function(){ + if(!_z.uploadUrl) return alert('请配置uploadUrl项'); + console.log(this.files) + var formData = new FormData(); + for(var i=0;i1){ + id = id[0].split('video/'); + if(id.length>1 && id[1].length){ + v.src='https://player.bilibili.com/player.html?bvid='+id[1]; + }else{ + return alert('b站'+error); + } + }else{ + return alert('b站'+error); + } + }else if(type === 3){ //优酷 + //源地址:https://v.youku.com/v_show/id_XMjM0ODA3NjIw.html + //处理地址:https://player.youku.com/embed/XMjM0ODA3NjIw + var id = url.value.split('.html'); + if(id.length>1){ + id = id[0].split('id_'); + if(id.length>1 && id[1].length){ + v.src='https://player.youku.com/embed/'+id[1]; + }else{ + return alert('优酷:'+error); + } + }else{ + return alert('优酷:'+error); + } + } + } + _z.setHTML(v,true); + close.style.display='none'; + _z.pd(); + } + }, + //创建菜单 + createMenu:function(json){ + var _z = this; + var li = this.c('li'); + if(json.id)li.id = json.id; + if(json.css)li.className = json.css; + if(json.style)this.css += json.style; + //将菜单设置成文字或者图标 + if(json.menu || json.icon){ + var div = this.c('div'); + div.className='iceEditor-exec'; + if(json.menu){ + div.innerHTML = json.menu; + }else{ + if(json.icon)div.innerHTML = ''; + } + if(json.data)div.setAttribute('data',json.data); + li.appendChild(div); + } + //使用下拉菜单 + if(json.dropdown){ + var div = this.c('div'); + div.className='iceEditor-menuDropdown'; + div.innerHTML = json.dropdown; + li.appendChild(div); + li.openMenu = 1; + li.onmouseover = function(){ + if(li.openMenu)div.className = 'iceEditor-menuDropdown iceEditor-menuActive'; + } + li.onmouseout = function(){ + div.className = 'iceEditor-menuDropdown'; + } + var exec = div.getElementsByClassName('iceEditor-exec'); + for(var i=0;i
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 文字大小
  • '}); + + //文字背景颜色 + var html='
      '; + for(var i=0;i'; + } + html+='
    • 文字背景颜色
    '; + this.createMenu({name:'backColor',icon:'backColor',dropdown:html}); + + //文字颜色 + var html='
      '; + for(var i=0;i'; + } + html+='
    • 文字颜色
    '; + this.createMenu({name:'foreColor',icon:'foreColor',dropdown:html}); + + //加粗 + this.createMenu({name:'bold',data:'bold',icon:'bold'}); + //倾斜 + this.createMenu({name:'italic',data:'italic',icon:'italic'}); + //下划线 + this.createMenu({name:'underline',data:'underline',icon:'underline'}); + //删除线 + this.createMenu({name:'strikeThrough',data:'strikeThrough',icon:'strike'}); + //左对齐 + this.createMenu({name:'justifyLeft',data:'justifyLeft',icon:'alignleft'}); + //居中对齐 + this.createMenu({name:'justifyCenter',data:'justifyCenter',icon:'aligncenter'}); + //右对齐 + this.createMenu({name:'justifyRight',data:'justifyRight',icon:'alignright'}); + //缩进 + this.createMenu({name:'indent',data:'indent',icon:'indent'}); + //取消缩进 + this.createMenu({name:'outdent',data:'outdent',icon:'outdent'}); + //有序列表 + this.createMenu({name:'insertOrderedList',data:'insertOrderedList',icon:'orderedlist'}); + //无序列表 + this.createMenu({name:'insertUnorderedList',data:'insertUnorderedList',icon:'unorderedlist'}); + //下标 + this.createMenu({name:'subscript',data:'subscript',icon:'subscript'}); + //上标 + this.createMenu({name:'superscript',data:'superscript',icon:'superscript'}); + //取消连接 + this.createMenu({name:'unlink',data:'unlink',icon:'unlink'}); + //添加水平线 + this.createMenu({name:'hr',data:'insertHorizontalRule',icon:'min'}); + //清除格式 + this.createMenu({name:'removeFormat',data:'removeFormat',icon:'remove'}); + //全选 + this.createMenu({name:'selectAll',data:'selectAll',icon:'empty'}); + //查看源码 + this.createMenu({name:'code',icon:'code',data:'code'}); + //隔线 + this.createMenu({name:'line',css:'line'}); + //表格 + this.createMenu({name:'table',icon:'table',dropdown:'
    • 表格:1×1
    '}); + //创建连接 + this.createMenu({name:'createLink',icon:'link',id:this.linkId,popup:{width:380,height:110,title:'添加链接',content:''}}); + //音乐 + this.createMenu({name:'music',icon:'music',id:this.musicId,popup:{width:380,height:80,title:'添加音乐',content:'
    音乐链接:确定
    '}}); + //附件 + this.createMenu({name:'files',icon:'files',id:this.filesId,popup:{width:450,height:250,title:'附件上传',content:'
    '}}); + + //添加图片 + this.createMenu({name:'insertImage',icon:'pic',id:this.imageId,popup:{width:450,height:250,title:'图片上传',content:'
    URL:宽:高:确定
    '}}); + //添加视频 + this.createMenu({name:'video',icon:'video',id:this.videoId,popup:{width:450,height:170,title:'添加视频',content:'
    URL:
    宽:高:确定
    '}}); + //窗口最大化 + this.createMenu({name:'max',icon:'max',data:'max',css:'iceEditor-maxWindow'}); + //窗口最小化 + this.createMenu({name:'min',icon:'min',data:'min',css:'iceEditor-minWindow'}); + //菜单栏禁止 + this.createMenu({name:'disabled',css:'iceEditor-disabledMask'}); +}; +//格式化菜单栏 +ice.editor.prototype.menuFormat=function() { + var _z=this; + this.menuHTML(); + var ul = this.c('ul'); + ul.className='iceEditor-menu'; + for(var i=0;i]+>/ig,'').replace(/<\s*\/a\s*>/ig,''); + var a = _z.c('a'); + if(_z.link.getElementsByTagName('input')[1].checked) a.target='_blank'; + a.href = _z.linkInput.value; + a.innerHTML = str; + _z.setHTML(a,true); + _z.link.getElementsByClassName('iceEditor-popup')[0].style.display='none'; + _z.pd(); + } + } + //添加音乐 + if(this.inArray('music',this.menu)){ + this.music = this.id(this.musicId); + this.musicInput = this.id(this.musicInputId); + _z.music.getElementsByClassName('iceEditor-btn')[0].onclick = function(){ + var a = _z.c('audio'); + a.src=_z.musicInput.value; + a.controls='controls'; + _z.setHTML(a,true); + _z.music.getElementsByClassName('iceEditor-popup')[0].style.display='none'; + _z.pd(); + } + } + if(this.inArray('video',this.menu)){ + this.video = this.id(this.videoId); + this.addVideo(); + } + if(this.inArray('files',this.menu)){ + this.files = this.id(this.filesId); + this.filesUpload(); + } + if(this.inArray('insertImage',this.menu)){ + this.insertImage = this.id(this.imageId); + this.imagesUpload(); + } + if(this.inArray('table',this.menu)){ + //表格 + this.table = this.id(this.tableId); + var tableBox = this.table.getElementsByClassName('iceEditor-tableBox')[0]; + var tableBgOn = this.table.getElementsByClassName('iceEditor-tableBgOn')[0]; + var tableNum = this.table.getElementsByClassName('iceEditor-tableNum')[0]; + tableBox.onmouseover=function(ev){ + var o = _z.getCoords(this),r=1,c=1; + this.onmousemove=function(ev){ + var Event = ev || event; + var x = Event.clientX - o.left - 5; + var y = Event.clientY - o.top - 5; + if(x<=180 && y<=180){ + r = Math.ceil(x/18); + c = Math.ceil(y/18); + tableBgOn.style.width = r*18 + 'px'; + tableBgOn.style.height = c*18 + 'px'; + tableNum.innerHTML='表格:'+r+"×"+c + } + } + this.onmousedown=function(){ + var tableNode=_z.c('table'); + tableNode.width='100%'; + tableNode.border=1; + tableNode.style.border='1px solid #bdbdbd'; + tableNode.style.borderSpacing=0; + tableNode.style.borderCollapse='collapse'; + tableNode.className='table table-border'; + for(var x=0;x"); + }else{ + _z.tool.className='iceEditor-tool iceEditor-noselect'; + d.style.display='block'; + this.className='iceEditor-exec iceEditor-active'; + _z.code=1; + _z.d.body.className='iceEditor-code'; + var pre = _z.d.body.getElementsByTagName('pre'); + //处理pre标签 + for(var s=0;s/g,"\n"); + var text = _z.getHTML(); + //格式化段落 + text = text.replace(/<\/p>

    /gim,"<\/p>\n

    ").replace(/>

    \n\n<");
    +						_z.d.body.innerHTML=_z.unhtml(text);
    +						
    +					}
    +					break;
    +					//最大化
    +					case 'max':
    +					var webHeight = window.innerHeight; //页面视口高度
    +					if (typeof webHeight != 'number') {
    +						if (document.compatMode == 'CSS1Compat') {
    +							webHeight = document.documentElement.clientHeight;
    +						} else {
    +							webWidth = document.body.clientWidth;
    +						}
    +					}
    +					_z.editor.style.position='fixed';
    +					_z.editor.style.zIndex=_z.getTime;
    +					_z.editor.style.width='100%';
    +					_z.editor.style.height='100%';
    +					_z.editor.style.top=0;
    +					_z.editor.style.left=0;
    +					_z.iframe.height=webHeight-35-20+'px';
    +					this.parentNode.style.display='none';
    +					_z.tool.getElementsByClassName('iceEditor-minWindow')[0].style.display='block';
    +					break;
    +					//最小化
    +					case 'min':
    +					_z.editor.removeAttribute('style');
    +					_z.iframe.height=_z.height;
    +					this.parentNode.style.display='none';
    +					_z.tool.getElementsByClassName('iceEditor-maxWindow')[0].style.display='block';
    +					break;
    +					//默认执行execCommand
    +					default:
    +					var b = this.attr.split('|');
    +					if(b.length>1){
    +						_z.w.document.execCommand(b[0], false, b[1]);
    +					}else{
    +						_z.w.document.execCommand(b[0], false, null);
    +					}
    +					_z.range.getRangeAt(0).collapse();
    +				}
    +				return false;
    +			}
    +		}
    +	}
    +};
    +//纯文本粘贴
    +ice.editor.prototype.paste=function(){
    +	var _z=this;
    +	var upload = function(imgBase64){
    +		//如果禁用上传到服务期,则直接以base64格式显示图像
    +		if(!_z.screenshotUpload){
    +			var p = _z.c('p');
    +			var a = _z.c('img');
    +			a.src = imgBase64;
    +			p.appendChild(a);
    +			_z.setHTML(p,true);
    +			return;
    +		}
    +		function dataURItoBlob(base64Data) {
    +			var byteString;
    +			if (base64Data.split(',')[0].indexOf('base64') >= 0){
    +				byteString = atob(base64Data.split(',')[1]);
    +			}else{
    +				byteString = unescape(base64Data.split(',')[1]);
    +			}
    +			var mimeString = base64Data.split(',')[0].split(':')[1].split(';')[0];
    +			var a = new Uint8Array(byteString.length);
    +			for (var i = 0; i < byteString.length; i++) {
    +				a[i] = byteString.charCodeAt(i);
    +			}
    +			return new Blob([a], {type:mimeString});
    +		}
    +		var blob = dataURItoBlob(imgBase64);
    +		var formData = new FormData();
    +		formData.append('file[]', blob);
    +		_z.ajax({
    +			url:_z.uploadUrl,
    +			data: formData,
    +			success: function (res) {
    +				if(res){
    +					for(var f=0;f'),true);
    +			return;
    +		}
    +		//以换行方式分割容
    +		var t = text.split('\n');
    +		if(t.length==1){
    +			_z.setText(text);
    +			return;
    +		}
    +		for(var i=0;i
    ':'
    '; + var range = _z.range.getRangeAt(0); + range.insertNode(range.createContextualFragment(br)); + //接下来这一步是为了修正光标位置 + var node = _z.range.anchorNode.nextSibling.nextSibling; + range.setStart(node,0); + range.setEnd(node,0); + range.collapse(); + }else if(_z.parentTagName == 'PRE' || _z.range.anchorNode.tagName == 'PRE'){ + _z.setText('
    ',true); + } + e.preventDefault(); + return; + } + } + // 去除Crtl+b/Ctrl+i/Ctrl+u等快捷键 + // e.metaKey for mac + if (e.ctrlKey || e.metaKey) { + switch(e.keyCode){ + case 13:{console.log(1);e.preventDefault();break;} + case 66: //ctrl+B or ctrl+b + case 98: + case 73: //ctrl+I or ctrl+i + case 105: + case 85: //ctrl+U or ctrl+u + case 117: {e.preventDefault();break;} + } + } + }); +}; +//配置格式化 +ice.editor.prototype.create=function() { + //添加样式 + if(this.cssConfig.styleSheet){ + this.cssConfig.styleSheet.cssText=this.css; + }else{ + this.cssConfig.innerHTML=this.css; + } + this.menuFormat(); + this.menuAction(); + this.disableds.style.display = this.disabled?'block':'none'; +}; +//获取编辑器的HTML内容 +ice.editor.prototype.getHTML=function() { + return this.content.innerHTML; +}; +//获取编辑器的Text内容 +ice.editor.prototype.getText=function() { + return this.content.innerText; +}; +//设置编辑器的内容 +ice.editor.prototype.setValue=function(v) { + this.content.innerHTML=v; +}; +//追加编辑器的内容 +ice.editor.prototype.addValue=function(v) { + this.content.innerHTML+=v; +}; +//编辑器图标 +ice.editor.css='.iceEditor{color:#353535;font-family:"Microsoft YaHei";font-size:14px;background:#fff;position:relative;border:solid 1px #ccc}.iceEditor *{margin:0;padding:0;box-sizing:border-box}.iceEditor a{color:#606060;text-decoration:none;-webkit-tap-highlight-color:transparent}.iceEditor a:hover{color:#000}.iceEditor input{height:27px;line-height:27px;padding:3px;border:1px solid #B7B7B7;font-family:inherit;font-size:inherit;vertical-align:middle;outline:none}.iceEditor-exec{cursor:pointer}.iceEditor-icon{width:16px;height:16px;fill:currentColor;overflow:hidden;vertical-align:middle;font-size:16px}.iceEditor-noselect{-webkit-touch-callout:none;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.iceEditor-menuDropdown{min-width:35px;min-height:35px;transition:all .4s ease;top:50px;opacity:0;visibility:hidden;position:absolute;background:#fff;z-index:999;box-shadow:0 2px 9px 0 rgba(0,0,0,.2);border-bottom:2px solid #676767;border-top:1px solid #676767}.iceEditor-menuDropdown::before{content:"";display:block;width:0;height:0;border-left:8px solid transparent;border-right:8px solid transparent;border-bottom:8px solid #676767;position:absolute;top:-8px;left:9px}.iceEditor-menuTitle{width:100%!important;text-align:center;height:30px;line-height:30px;border-top:1px solid #efefef}.iceEditor-tool{width:100%;background:#eee;border-bottom:solid 1px #ccc;position:relative}.iceEditor-tool:after,.iceEditor-tool:before{display:table;content:" "}.iceEditor-tool:after{clear:both}.iceEditor-menu{width:100%;padding:0 10px;display:inline-block;float:left}.iceEditor-menu a{list-style:none;float:left;min-width:35px;height:35px;padding:0 5px;text-align:center;line-height:35px;cursor:pointer}.iceEditor-menu a:hover{background:#cdcdcd}.iceEditor-menu>li>div.iceEditor-exec{list-style:none;float:left;min-width:35px;height:35px;padding:0 5px;text-align:center;line-height:35px;cursor:pointer}.iceEditor-menu>li>div.iceEditor-exec:hover{background:#cdcdcd}.iceEditor-menu svg{fill:currentColor;overflow:hidden;vertical-align:middle;font-size:16px}.iceEditor-menu .iceEditor-active{background:#e0e0e0;position:relative;z-index:999}.iceEditor-menu .iceEditor-disabledMask{background:rgba(238,238,238,0.7);width:100%;height:100%;position:absolute;left:0;top:0;display:none}.iceEditor-menu li{display:inline-block;float:left}.iceEditor-menu li .iceEditor-menuDropdown.iceEditor-menuActive{top:44px;opacity:1;visibility:visible}.iceEditor-menu li.iceEditor-minWindow{display:none}.iceEditor-menu li.iceEditor-maxWindow,.iceEditor-menu li.iceEditor-minWindow{float:right}.iceEditor-menu li.iceEditor-maxWindow>div,.iceEditor-menu li.iceEditor-minWindow>div{position:relative;z-index:999}.iceEditor-menu li.iceEditor-maxWindow .iceEditor-icon,.iceEditor-menu li.iceEditor-minWindow .iceEditor-icon{color:#606060}.iceEditor-codeLanguages select{padding:5px 5px;width:120px;outline:none;font-size:15px;margin-top:10px;}.iceEditor-line{height:35px;border-right:1px solid #ccc;width:1px;margin:0 10px;vertical-align:middle}.iceEditor-uploadInput{display:none}.iceEditor-uploadBtn{float:none;width:auto;font-size:15px;background:#00b7ee;height:40px;line-height:40px;padding:0 30px;color:#fff;display:inline-block;margin:0 auto 15px auto;cursor:pointer;box-shadow:0 1px 1px rgba(0,0,0,.1)}.iceEditor-uploadBtn:hover{background:#009ccb}.iceEditor-uploadIcon{width:45px;height:45px;color:#bababa;margin:45px 20px 10px}.iceEditor-backColor{width:230px;padding:5px}.iceEditor-backColor span{width:20px;height:20px;padding:0;margin:1px;display:inline-block}.iceEditor-fontSize{width:280px}.iceEditor-fontSize li{width:40px;text-align:center}.iceEditor-fontSize span{width:40px;display:inline-block;padding:10px 0}.iceEditor-fontSize span:hover{background:#eee;color:#4CAF50}.iceEditor-createLink label{margin-top:10px;display:inline-block;}.iceEditor-link{width:230px;}.iceEditor-popup .iceEditor-insertImage{text-align:center}.iceEditor-popup .iceEditor-insertImageUrl{width:140px;height:27px;outline:0;margin-right:15px}.iceEditor-popup .iceEditor-inputWidth{width:50px;height:27px;outline:0;margin-right:15px}.iceEditor-popup .iceEditor-inputHeight{width:50px;height:27px;outline:0}.iceEditor-popup .iceEditor-btn{width:auto;display:inline-block;float:none;color:#fff!important;height:27px;line-height:25px;padding:0 10px;background:#939393;vertical-align:middle;margin-left:5px;border:1px solid #7b7b7b}.iceEditor-popup .iceEditor-btn:hover{background:#7b7b7b!important;color:#fff}.iceEditor-tableBox{position:relative;width:190px;height:214px;padding:5px;overflow:hidden}.iceEditor-tableBgOn{position:absolute!important;top:5px;left:5px;z-index:4;width:18px;height:18px;background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABIAAAASAgMAAAAroGbEAAAACVBMVEUAAIjd6vvD2f9LKLW+AAAAAXRSTlMAQObYZgAAAAFiS0dEAIgFHUgAAAAJcEhZcwAACxMAAAsTAQCanBgAAAAHdElNRQfYAR0BKwNDEVT0AAAAG0lEQVQI12NgAAOtVatWMTCohoaGUY+EmIkEAEruEzK2J7tvAAAAAElFTkSuQmCC) repeat}.iceEditor-tableBgOff{width:180px;height:180px;background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABIAAAASAgMAAAAroGbEAAAACVBMVEUAAIj4+Pjp6ekKlAqjAAAAAXRSTlMAQObYZgAAAAFiS0dEAIgFHUgAAAAJcEhZcwAACxMAAAsTAQCanBgAAAAHdElNRQfYAR0BKhmnaJzPAAAAG0lEQVQI12NgAAOtVatWMTCohoaGUY+EmIkEAEruEzK2J7tvAAAAAElFTkSuQmCC) repeat}.iceEditor-tableNum{height:30px;line-height:30px;text-align:center;color:#757575}.iceEditor-video{text-align:left}.iceEditor-video label{margin-right:20px;display:inline-block}.iceEditor-video input{margin-right:5px}.iceEditor-video div{height:27px;margin-bottom:10px}.iceEditor-popup .iceEditor-videoUrl{width:380px;height:27px;outline:0;margin-right:0}.iceEditor-content{width:100%;height:100%;padding:20px;position:relative}.iceEditor-content:focus{outline:0}.iceEditor-dragBg{position:absolute;width:100%;height:100%;top:0;left:0;z-index:1;display:none;}.iceEditor-drag{color:#757575;background:#eee;text-align:center;height:12px;line-height:0;cursor:n-resize}.iceEditor-disabled{position:absolute;width:100%;height:100%;top:0;left:0;background:rgba(191,191,191,.79);z-index:99999;display:none}.iceEditor-popup{display:none}.iceEditor-popupMain{width:400px;height:200px;position:fixed;margin:auto;top:0;bottom:0;left:0;right:0;background:#fff;box-shadow:0 1px 1px rgba(0,0,0,.12);z-index:2;animation-name:iceEditorPopup;animation-duration:.5s}.iceEditor-popupBox{width:100%;height:100%;position:fixed;top:0;left:0;background:rgba(0,0,0,.33);opacity:.5;filter:alpha(opacity=50);z-index:1}.iceEditor-popupTitle{width:100%;height:30px;line-height:30px;background:#2f2f2f;padding:0 10px;color:#fff}.iceEditor-popupTitle span{display:inline-block;vertical-align:middle}.iceEditor-popupTitle::before{content:"";display:inline-block;width:10px;height:10px;border-radius:10px;background:#c7f98c;vertical-align:middle;margin-right:8px}.iceEditor-popupClose{float:right;padding:0 10px;color:#fff;font-size:18px;cursor:pointer}.iceEditor-popupClose:hover{color:#8fe5ff}.iceEditor-popupContent{width:100%;padding:10px;color:#000;overflow:auto;float:left}.iceEditor-popupBtn{width:100%;border:0;color:#fff;background:#03A9F4;border-top:1px solid #efefef;padding:0 20px;margin:0;height:35px;text-align:center;line-height:35px;cursor:pointer;margin-top:20px;outline:0}.iceEditor-popupBtn:hover{color:#151515;background:#efefef}@keyframes iceEditorPopup{0%{top:-100px;opacity:0}to{top:0;opacity:1}}@media (max-width:768px){.iceEditor-menu .iceEditor-line{display:none}.iceEditor-popupMain{margin:0!important;width:90%!important;height:90%!important;top:5%!important;left:5%!important}@keyframes iceEditorPopup{0%{margin-top:-50px}to{margin-top:0}}}'; +//编辑器图标 +ice.editor.svg = ''; (function svg(){var c=document.createElement('style'),d,s,b=document.body;c.type='text/css';if(c.styleSheet){c.styleSheet.cssText=ice.editor.css;}else{c.innerHTML=ice.editor.css;}document.getElementsByTagName('head')[0].appendChild(c);d=document.createElement("div");d.innerHTML=ice.editor.css+ice.editor.svg;ice.editor.svg=null;s=d.getElementsByTagName("svg")[0];if(s){s.setAttribute("aria-hidden","true");s.style.position="absolute";s.style.width=0;s.style.height=0;s.style.overflow="hidden";if(b.firstChild){b.firstChild.parentNode.insertBefore(s,b.firstChild)}else{b.appendChild(s)}}})(); \ No newline at end of file diff --git a/src/iceEditor.min.js b/src/iceEditor.min.js new file mode 100644 index 0000000..6fb15f0 --- /dev/null +++ b/src/iceEditor.min.js @@ -0,0 +1,19 @@ +/** + +------------------------------------------------------------------------------------+ + + iceEditor(富文本编辑器) + +------------------------------------------------------------------------------------+ + + iceEditor v1.1.6 + * MIT License By www.iceui.net + + 作者:ice + + 官方:www.iceui.net + + 时间:2020-06-20 + +------------------------------------------------------------------------------------+ + + 版权声明:该版权完全归iceUI官方所有,可转载使用和学习,但请务必保留版权信息 + +------------------------------------------------------------------------------------+ + + iceEditor是一款简约风格的富文本编辑器,体型十分娇小,无任何依赖,整个编辑器只有一个 + + 文件,功能却很不平凡!简约的唯美设计,简洁、极速、使用它的时候不需要引用jQuery、font + + css……等文件,因为整个编辑器只是一个Js,支持上传图片、附件!支持添加音乐、视频! + +------------------------------------------------------------------------------------+ +*/ +"use strict";var ice=ice||{};ice.editor=function(a){var b,c,d;return this.menu=["backColor","fontSize","foreColor","bold","italic","underline","strikeThrough","line","justifyLeft","justifyCenter","justifyRight","indent","outdent","line","insertOrderedList","insertUnorderedList","line","superscript","subscript","createLink","unlink","line","hr","table","files","music","video","insertImage","removeFormat","line","code"],this.backColor=["#ffffff","#000000","#eeece1","#1f497d","#4f81bd","#c0504d","#9bbb59","#8064a2","#4bacc6","#f79646","#f2f2f2","#979797","#ddd9c3","#c6d9f0","#dbe5f1","#f2dcdb","#ebf1dd","#e5e0ec","#dbeef3","#fdeada","#d8d8d8","#595959","#c4bd97","#8db3e2","#b8cce4","#e5b9b7","#d7e3bc","#ccc1d9","#b7dde8","#fbd5b5","#bfbfbf","#3f3f3f","#938953","#548dd4","#95b3d7","#d99694","#c3d69b","#b2a2c7","#92cddc","#fac08f","#a5a5a5","#262626","#494429","#17365d","#366092","#953734","#76923c","#5f497a","#31859b","#e36c09","#7f7f7f","#0c0c0c","#1d1b10","#0f243e","#244061","#632423","#4f6128","#3f3151","#205867","#974806","#c00000","#ff0000","#ffc000","#ffff00","#92d050","#00b050","#00b0f0","#0070c0","#002060","#7030a0"],this.foreColor=this.backColor,this.width="100%",this.height="400px",this.code=0,this.maxWindow=1,this.disabled=0,this.css="",this.uploadUrl=0,this.screenshot=1,this.screenshotUpload=1,this.htmlTag=["meta","style","script","object","form","iframe"],this.formatTag=["address","caption","dd","div","dl","dt","fieldset","h1","h2","h3","h4","h5","h6","legend","fieldset","li","noframes","noscript","ol","ul","p","pre","table","tbody","tfoot","th","thead","tr"],this.getTime="1"+String((new Date).getTime()).substr(4,8),this.iframeId="_iframe"+this.getTime,this.toolId="_tool"+this.getTime,this.linkId="_link"+this.getTime,this.linkInputId="_LinkInput"+this.getTime,this.musicId="_music"+this.getTime,this.musicInputId="_musicInput"+this.getTime,this.videoId="_video"+this.getTime,this.imageId="_image"+this.getTime,this.imgUploadId="_imgUpload"+this.getTime,this.filesId="_files"+this.getTime,this.filesUploadId="_filesUpload"+this.getTime,this.tableId="_table"+this.getTime,this.dragId="_drag"+this.getTime,this.menuList={},b=this,this.editor=this.id(a),this.editor?(this.textarea=0,"TEXTAREA"!==this.editor.nodeName&&"DIV"!==this.editor.nodeName?console.log("暂不支持该标签-->"+this.editor.nodeName+" 推荐使用div"):("TEXTAREA"==this.editor.nodeName?(this.editor.style.display="none",this.divId="_div"+this.getTime,c=this.c("div"),c.className="iceEditor",c.id=this.divId,this.insertAfter(c,this.editor),this.textarea=this.editor,this.editor=this.id(this.divId),this.value=this.textarea.value):(this.editor.className="iceEditor",this.value=this.editor.innerHTML,this.editor.innerHTML=""),this.cssConfig=this.c("style"),this.cssConfig.type="text/css",this.editor.appendChild(this.cssConfig),this.tool=this.c("div"),this.tool.id=this.toolId,this.tool.className="iceEditor-tool iceEditor-noselect",this.editor.appendChild(this.tool),this.iframe=this.c("iframe"),this.iframe.id=this.iframeId,this.iframe.className="iceEditor-noselect",this.iframe.frameBorder=0,this.editor.appendChild(this.iframe),this.dragBg=this.c("div"),this.dragBg.className="iceEditor-dragBg",this.editor.appendChild(this.dragBg),this.drag=this.c("div"),this.drag.id=this.dragId,this.drag.className="iceEditor-drag iceEditor-noselect",this.drag.innerHTML='',this.editor.appendChild(this.drag),this.drag.onmousedown=function(){var a,c;b.dragBg.style.display="block",a=event.clientY,c=b.iframe.clientHeight,window.onmousemove=function(){var d=event.clientY-a;c>=100?(b.iframe.height=c+d+"px",b.height=c+d+"px"):(b.iframe.height="100px",b.height=c+d+"px")},window.onmouseup=function(){window.onmousemove=null,window.onmouseup=null,b.dragBg.style.display="none"}},this.disableds=this.c("div"),this.disableds.className="iceEditor-disabled",this.editor.appendChild(this.disableds),this.w=this.iframe.contentWindow,this.d=this.iframe.contentDocument,this.d.open(),d=this.value.trim(),d.length&&"

    "==d.substr(0,3)||(d="

    "+this.value+"

    "),this.d.write(''+d+""),this.d.close(),this.d.body.designMode="On",this.d.body.contentEditable=!0,this.d.body.addEventListener("click",function(){b.parentTagName=b.range.anchorNode.parentNode.tagName}),this.content=this.d.body,this.textarea&&setInterval(function(){var d,e,a=b.code?b.html(b.getHTML()):b.getHTML(),c=b.c("p");for(c.innerHTML=a,d=c.getElementsByTagName("pre"),e=0;e/g,"\n");b.textarea.innerHTML=b.unhtml(c.innerHTML)},1e3),this.init(),this.create(),this.paste(),void 0)):alert("请提供一个有效的id")},ice.editor.prototype={id:function(a){return document.getElementById(a)},c:function(a){return document.createElement(a)},init:function(){this.files=null,this.insertImage=null,this.element=this.d.body,this.range=this.d.createRange?this.w.getSelection():this.d.selection.createRange()},insertAfter:function(a,b){var c=b.parentNode;c.lastChild==b?c.appendChild(a,b):c.insertBefore(a,b.nextSibling)},setHTML:function(a,b){this.element.focus();var c=this.range.getRangeAt(0);b||a.appendChild(c.extractContents()),c.deleteContents(),c.insertNode(this.w.document.createDocumentFragment().appendChild(a)),c.collapse(!1)},setText:function(a,b){var c,d,f,g,e;for(this.element.focus(),c=this.range.getRangeAt(0),c.deleteContents(),d=document.createElement("div"),b?d.innerHTML=a:d.appendChild(document.createTextNode(a)),e=document.createDocumentFragment();f=d.firstChild;)g=e.appendChild(f);c.insertNode(e),g&&(c=c.cloneRange(),c.setStartAfter(g),c.collapse(!0),this.range.removeAllRanges(),this.range.addRange(c))},getSelectHTML:function(){var a=this.c("p");return a.appendChild(this.range.getRangeAt(0).cloneContents()),a.innerHTML},getSelectText:function(){return"false"==this.range.toString()||""==this.range.toString()?"":this.range.toString()},unhtml:function(a){var b="";return 0==a.length?"":(b=a.replace(/&/g,"&"),b=b.replace(//g,">"),b=b.replace(/\'/g,"'"),b=b.replace(/\"/g,"""))},html:function(a){var b="";return 0==a.length?"":(b=a.replace(/</g,"<"),b=b.replace(/>/g,">"),b=b.replace(/'/g,"'"),b=b.replace(/"/g,'"'),b=b.replace(/&/g,"&"))},toText:function(a){var c,b=this.c("div");return null!=b.textContent?b.textContent=a:b.innerText=a,c=b.innerHTML,b=null,c},toHTML:function(a){var c,b=this.c("div");return b.innerHTML=a,c=b.innerText||b.textContent,b=null,c},inNodeParent:function(a,b){return a?a.parentNode?"string"==typeof b?(b=b.toUpperCase(),a.tagName==b?!0:a.parentNode.tagName==b?!0:this.inNodeParent(a.parentNode,b)):a.parentNode==b?!0:this.inNodeParent(a.parentNode,b):!1:!1},inArray:function(a,b){if("string"==typeof a||"number"==typeof a){for(var c in b)if(a===b[c])return!0;return!1}},popup:function(a){var b,c,d,e;return a=a||{},b=a.width||"400",c=a.height||"200",d=a.title||"",e=a.content||"",'
    '+d+'
    '+e+"
    "},getCoords:function(a){var b=a.getBoundingClientRect(),c=a.ownerDocument,d=c.body,e=c.documentElement,f=e.clientTop||d.clientTop||0,g=e.clientLeft||d.clientLeft||0,h=b.top-f,i=b.left-g;return{top:h,left:i}},pd:function(){window.event?window.event.cancelBubble=!0:e.stopPropagation()},isIE:function(){return!!window.ActiveXObject||"ActiveXObject"in window},ajax:function(a){if(a=a||{},a.url){a.timeout=a.timeout||15e3,a.data=a.data||{};var b=new XMLHttpRequest;b.open("POST",a.url,!0),b.setRequestHeader("X-Requested-With","XMLHttpRequest"),b.send(a.data),a.loading&&a.loading(),a.timer=setTimeout(function(){b.onreadystatechange=null,a.error&&a.error("网络超时。")},a.timeout),b.onreadystatechange=function(){var c;4==b.readyState&&(clearTimeout(a.timer),b.status>=200&&b.status<300||304==b.status?(c=b.responseText.length>0?JSON.parse(b.responseText):"",a.success&&a.success(c)):a.error&&a.error(b.status))}}},imagesUpload:function(){var a=this,b=a.insertImage.getElementsByClassName("iceEditor-popup")[0],c=a.insertImage.getElementsByClassName("iceEditor-insertImageUrl")[0],d=a.insertImage.getElementsByClassName("iceEditor-inputWidth")[0],e=a.insertImage.getElementsByClassName("iceEditor-inputHeight")[0],f=a.insertImage.getElementsByClassName("iceEditor-btn")[0];f.onclick=function(){var f=a.c("img");f.src=c.value,d.value.trim()&&(f.width=d.value.trim()),e.value.trim()&&(f.height=e.value.trim()),a.setHTML(f),b.style.display="none",a.pd()},a.id(a.imgUploadId).onchange=function(){var c,d;if(!a.uploadUrl)return alert("请配置uploadUrl项");for(console.log(this.files),c=new FormData,d=0;d1))return alert("b站"+j);if(k=k[0].split("video/"),!(k.length>1&&k[1].length))return alert("b站"+j);i.src="https://player.bilibili.com/player.html?bvid="+k[1]}else if(3===b){if(k=d.value.split(".html"),!(k.length>1))return alert("优酷:"+j);if(k=k[0].split("id_"),!(k.length>1&&k[1].length))return alert("优酷:"+j);i.src="https://player.youku.com/embed/"+k[1]}a.setHTML(i,!0),c.style.display="none",a.pd()}},createMenu:function(a){var d,e,f,b=this,c=this.c("li");if(a.id&&(c.id=a.id),a.css&&(c.className=a.css),a.style&&(this.css+=a.style),(a.menu||a.icon)&&(d=this.c("div"),d.className="iceEditor-exec",a.menu?d.innerHTML=a.menu:a.icon&&(d.innerHTML=''),a.data&&d.setAttribute("data",a.data),c.appendChild(d)),a.dropdown)for(d=this.c("div"),d.className="iceEditor-menuDropdown",d.innerHTML=a.dropdown,c.appendChild(d),c.openMenu=1,c.onmouseover=function(){c.openMenu&&(d.className="iceEditor-menuDropdown iceEditor-menuActive")},c.onmouseout=function(){d.className="iceEditor-menuDropdown"},e=d.getElementsByClassName("iceEditor-exec"),f=0;f
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 文字大小
  • '}),a='
      ',b=0;b';for(a+='
    • 文字背景颜色
    ',this.createMenu({name:"backColor",icon:"backColor",dropdown:a}),a='
      ',b=0;b';a+='
    • 文字颜色
    ',this.createMenu({name:"foreColor",icon:"foreColor",dropdown:a}),this.createMenu({name:"bold",data:"bold",icon:"bold"}),this.createMenu({name:"italic",data:"italic",icon:"italic"}),this.createMenu({name:"underline",data:"underline",icon:"underline"}),this.createMenu({name:"strikeThrough",data:"strikeThrough",icon:"strike"}),this.createMenu({name:"justifyLeft",data:"justifyLeft",icon:"alignleft"}),this.createMenu({name:"justifyCenter",data:"justifyCenter",icon:"aligncenter"}),this.createMenu({name:"justifyRight",data:"justifyRight",icon:"alignright"}),this.createMenu({name:"indent",data:"indent",icon:"indent"}),this.createMenu({name:"outdent",data:"outdent",icon:"outdent"}),this.createMenu({name:"insertOrderedList",data:"insertOrderedList",icon:"orderedlist"}),this.createMenu({name:"insertUnorderedList",data:"insertUnorderedList",icon:"unorderedlist"}),this.createMenu({name:"subscript",data:"subscript",icon:"subscript"}),this.createMenu({name:"superscript",data:"superscript",icon:"superscript"}),this.createMenu({name:"unlink",data:"unlink",icon:"unlink"}),this.createMenu({name:"hr",data:"insertHorizontalRule",icon:"min"}),this.createMenu({name:"removeFormat",data:"removeFormat",icon:"remove"}),this.createMenu({name:"selectAll",data:"selectAll",icon:"empty"}),this.createMenu({name:"code",icon:"code",data:"code"}),this.createMenu({name:"line",css:"line"}),this.createMenu({name:"table",icon:"table",dropdown:'
    • 表格:1×1
    '}),this.createMenu({name:"createLink",icon:"link",id:this.linkId,popup:{width:380,height:110,title:"添加链接",content:''}}),this.createMenu({name:"music",icon:"music",id:this.musicId,popup:{width:380,height:80,title:"添加音乐",content:'
    音乐链接:确定
    '}}),this.createMenu({name:"files",icon:"files",id:this.filesId,popup:{width:450,height:250,title:"附件上传",content:'
    '}}),this.createMenu({name:"insertImage",icon:"pic",id:this.imageId,popup:{width:450,height:250,title:"图片上传",content:'
    URL:宽:高:确定
    '}}),this.createMenu({name:"video",icon:"video",id:this.videoId,popup:{width:450,height:170,title:"添加视频",content:'
    URL:
    宽:高:确定
    '}}),this.createMenu({name:"max",icon:"max",data:"max",css:"iceEditor-maxWindow"}),this.createMenu({name:"min",icon:"min",data:"min",css:"iceEditor-minWindow"}),this.createMenu({name:"disabled",css:"iceEditor-disabledMask"})},ice.editor.prototype.menuFormat=function(){var b,c,d,e,f,a=this;for(this.menuHTML(),b=this.c("ul"),b.className="iceEditor-menu",c=0;c]+>/gi,"").replace(/<\s*\/a\s*>/gi,""),c=a.c("a");a.link.getElementsByTagName("input")[1].checked&&(c.target="_blank"),c.href=a.linkInput.value,c.innerHTML=b,a.setHTML(c,!0),a.link.getElementsByClassName("iceEditor-popup")[0].style.display="none",a.pd()}),this.inArray("music",this.menu)&&(this.music=this.id(this.musicId),this.musicInput=this.id(this.musicInputId),a.music.getElementsByClassName("iceEditor-btn")[0].onclick=function(){var b=a.c("audio");b.src=a.musicInput.value,b.controls="controls",a.setHTML(b,!0),a.music.getElementsByClassName("iceEditor-popup")[0].style.display="none",a.pd()}),this.inArray("video",this.menu)&&(this.video=this.id(this.videoId),this.addVideo()),this.inArray("files",this.menu)&&(this.files=this.id(this.filesId),this.filesUpload()),this.inArray("insertImage",this.menu)&&(this.insertImage=this.id(this.imageId),this.imagesUpload()),this.inArray("table",this.menu)&&(this.table=this.id(this.tableId),d=this.table.getElementsByClassName("iceEditor-tableBox")[0],e=this.table.getElementsByClassName("iceEditor-tableBgOn")[0],f=this.table.getElementsByClassName("iceEditor-tableNum")[0],d.onmouseover=function(){var c=a.getCoords(this),d=1,g=1;this.onmousemove=function(a){var b=a||event,h=b.clientX-c.left-5,i=b.clientY-c.top-5;180>=h&&180>=i&&(d=Math.ceil(h/18),g=Math.ceil(i/18),e.style.width=18*d+"px",e.style.height=18*g+"px",f.innerHTML="表格:"+d+"×"+g)},this.onmousedown=function(){var c,e,f,h,b=a.c("table");for(b.width="100%",b.border=1,b.style.border="1px solid #bdbdbd",b.style.borderSpacing=0,b.style.borderCollapse="collapse",b.className="table table-border",c=0;g>c;c++)for(e=b.insertRow(),f=0;d>f;f++)h=e.insertCell(),h.innerHTML="
    ";a.setHTML(b,!0)},this.onmouseout=function(){this.onmousemove=null,this.onmouseout=null}}),this.editor.style.width=this.width,this.iframe.width=this.width,this.iframe.height=this.height},ice.editor.prototype.menuAction=function(){var c,a=this.tool.getElementsByClassName("iceEditor-exec"),b=this;for(c=0;c");else{for(b.tool.className="iceEditor-tool iceEditor-noselect",e.style.display="block",this.className="iceEditor-exec iceEditor-active",b.code=1,b.d.body.className="iceEditor-code",g=b.d.body.getElementsByTagName("pre"),h=0;h/g,"\n");f=b.getHTML(),f=f.replace(/<\/p>

    /gim,"

    \n

    ").replace(/>

    \n\n<"),b.d.body.innerHTML=b.unhtml(f)}break;case"max":i=window.innerHeight,"number"!=typeof i&&("CSS1Compat"==document.compatMode?i=document.documentElement.clientHeight:webWidth=document.body.clientWidth),b.editor.style.position="fixed",b.editor.style.zIndex=b.getTime,b.editor.style.width="100%",b.editor.style.height="100%",b.editor.style.top=0,b.editor.style.left=0,b.iframe.height=i-35-20+"px",this.parentNode.style.display="none",b.tool.getElementsByClassName("iceEditor-minWindow")[0].style.display="block";break;case"min":b.editor.removeAttribute("style"),b.iframe.height=b.height,this.parentNode.style.display="none",b.tool.getElementsByClassName("iceEditor-maxWindow")[0].style.display="block";break;default:j=this.attr.split("|"),j.length>1?b.w.document.execCommand(j[0],!1,j[1]):b.w.document.execCommand(j[0],!1,null),b.range.getRangeAt(0).collapse()}return!1})},ice.editor.prototype.paste=function(){function d(a){if(!a)return!1;var b=a.nextSibling;return b&&1!=b.nodeType&&(b=d(b)),b}var a=this,b=function(b){function e(a){var b,c,d,e;for(b=a.split(",")[0].indexOf("base64")>=0?atob(a.split(",")[1]):unescape(a.split(",")[1]),c=a.split(",")[0].split(":")[1].split(";")[0],d=new Uint8Array(b.length),e=0;e"),!0),void 0}if(i=f.split("\n"),1==i.length)return a.setText(f),void 0;for(j=0;j
    ":"
    ",c=a.range.getRangeAt(0),c.insertNode(c.createContextualFragment(g)),h=a.range.anchorNode.nextSibling.nextSibling,c.setStart(h,0),c.setEnd(h,0),c.collapse()):("PRE"==a.parentTagName||"PRE"==a.range.anchorNode.tagName)&&a.setText("
    ",!0),b.preventDefault(),void 0;if(b.ctrlKey||b.metaKey)switch(b.keyCode){case 13:console.log(1),b.preventDefault();break;case 66:case 98:case 73:case 105:case 85:case 117:b.preventDefault()}})},ice.editor.prototype.create=function(){this.cssConfig.styleSheet?this.cssConfig.styleSheet.cssText=this.css:this.cssConfig.innerHTML=this.css,this.menuFormat(),this.menuAction(),this.disableds.style.display=this.disabled?"block":"none"},ice.editor.prototype.getHTML=function(){return this.content.innerHTML},ice.editor.prototype.getText=function(){return this.content.innerText},ice.editor.prototype.setValue=function(a){this.content.innerHTML=a},ice.editor.prototype.addValue=function(a){this.content.innerHTML+=a},ice.editor.css='.iceEditor{color:#353535;font-family:"Microsoft YaHei";font-size:14px;background:#fff;position:relative;border:solid 1px #ccc}.iceEditor *{margin:0;padding:0;box-sizing:border-box}.iceEditor a{color:#606060;text-decoration:none;-webkit-tap-highlight-color:transparent}.iceEditor a:hover{color:#000}.iceEditor input{height:27px;line-height:27px;padding:3px;border:1px solid #B7B7B7;font-family:inherit;font-size:inherit;vertical-align:middle;outline:none}.iceEditor-exec{cursor:pointer}.iceEditor-icon{width:16px;height:16px;fill:currentColor;overflow:hidden;vertical-align:middle;font-size:16px}.iceEditor-noselect{-webkit-touch-callout:none;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.iceEditor-menuDropdown{min-width:35px;min-height:35px;transition:all .4s ease;top:50px;opacity:0;visibility:hidden;position:absolute;background:#fff;z-index:999;box-shadow:0 2px 9px 0 rgba(0,0,0,.2);border-bottom:2px solid #676767;border-top:1px solid #676767}.iceEditor-menuDropdown::before{content:"";display:block;width:0;height:0;border-left:8px solid transparent;border-right:8px solid transparent;border-bottom:8px solid #676767;position:absolute;top:-8px;left:9px}.iceEditor-menuTitle{width:100%!important;text-align:center;height:30px;line-height:30px;border-top:1px solid #efefef}.iceEditor-tool{width:100%;background:#eee;border-bottom:solid 1px #ccc;position:relative}.iceEditor-tool:after,.iceEditor-tool:before{display:table;content:" "}.iceEditor-tool:after{clear:both}.iceEditor-menu{width:100%;padding:0 10px;display:inline-block;float:left}.iceEditor-menu a{list-style:none;float:left;min-width:35px;height:35px;padding:0 5px;text-align:center;line-height:35px;cursor:pointer}.iceEditor-menu a:hover{background:#cdcdcd}.iceEditor-menu>li>div.iceEditor-exec{list-style:none;float:left;min-width:35px;height:35px;padding:0 5px;text-align:center;line-height:35px;cursor:pointer}.iceEditor-menu>li>div.iceEditor-exec:hover{background:#cdcdcd}.iceEditor-menu svg{fill:currentColor;overflow:hidden;vertical-align:middle;font-size:16px}.iceEditor-menu .iceEditor-active{background:#e0e0e0;position:relative;z-index:999}.iceEditor-menu .iceEditor-disabledMask{background:rgba(238,238,238,0.7);width:100%;height:100%;position:absolute;left:0;top:0;display:none}.iceEditor-menu li{display:inline-block;float:left}.iceEditor-menu li .iceEditor-menuDropdown.iceEditor-menuActive{top:44px;opacity:1;visibility:visible}.iceEditor-menu li.iceEditor-minWindow{display:none}.iceEditor-menu li.iceEditor-maxWindow,.iceEditor-menu li.iceEditor-minWindow{float:right}.iceEditor-menu li.iceEditor-maxWindow>div,.iceEditor-menu li.iceEditor-minWindow>div{position:relative;z-index:999}.iceEditor-menu li.iceEditor-maxWindow .iceEditor-icon,.iceEditor-menu li.iceEditor-minWindow .iceEditor-icon{color:#606060}.iceEditor-codeLanguages select{padding:5px 5px;width:120px;outline:none;font-size:15px;margin-top:10px;}.iceEditor-line{height:35px;border-right:1px solid #ccc;width:1px;margin:0 10px;vertical-align:middle}.iceEditor-uploadInput{display:none}.iceEditor-uploadBtn{float:none;width:auto;font-size:15px;background:#00b7ee;height:40px;line-height:40px;padding:0 30px;color:#fff;display:inline-block;margin:0 auto 15px auto;cursor:pointer;box-shadow:0 1px 1px rgba(0,0,0,.1)}.iceEditor-uploadBtn:hover{background:#009ccb}.iceEditor-uploadIcon{width:45px;height:45px;color:#bababa;margin:45px 20px 10px}.iceEditor-backColor{width:230px;padding:5px}.iceEditor-backColor span{width:20px;height:20px;padding:0;margin:1px;display:inline-block}.iceEditor-fontSize{width:280px}.iceEditor-fontSize li{width:40px;text-align:center}.iceEditor-fontSize span{width:40px;display:inline-block;padding:10px 0}.iceEditor-fontSize span:hover{background:#eee;color:#4CAF50}.iceEditor-createLink label{margin-top:10px;display:inline-block;}.iceEditor-link{width:230px;}.iceEditor-popup .iceEditor-insertImage{text-align:center}.iceEditor-popup .iceEditor-insertImageUrl{width:140px;height:27px;outline:0;margin-right:15px}.iceEditor-popup .iceEditor-inputWidth{width:50px;height:27px;outline:0;margin-right:15px}.iceEditor-popup .iceEditor-inputHeight{width:50px;height:27px;outline:0}.iceEditor-popup .iceEditor-btn{width:auto;display:inline-block;float:none;color:#fff!important;height:27px;line-height:25px;padding:0 10px;background:#939393;vertical-align:middle;margin-left:5px;border:1px solid #7b7b7b}.iceEditor-popup .iceEditor-btn:hover{background:#7b7b7b!important;color:#fff}.iceEditor-tableBox{position:relative;width:190px;height:214px;padding:5px;overflow:hidden}.iceEditor-tableBgOn{position:absolute!important;top:5px;left:5px;z-index:4;width:18px;height:18px;background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABIAAAASAgMAAAAroGbEAAAACVBMVEUAAIjd6vvD2f9LKLW+AAAAAXRSTlMAQObYZgAAAAFiS0dEAIgFHUgAAAAJcEhZcwAACxMAAAsTAQCanBgAAAAHdElNRQfYAR0BKwNDEVT0AAAAG0lEQVQI12NgAAOtVatWMTCohoaGUY+EmIkEAEruEzK2J7tvAAAAAElFTkSuQmCC) repeat}.iceEditor-tableBgOff{width:180px;height:180px;background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABIAAAASAgMAAAAroGbEAAAACVBMVEUAAIj4+Pjp6ekKlAqjAAAAAXRSTlMAQObYZgAAAAFiS0dEAIgFHUgAAAAJcEhZcwAACxMAAAsTAQCanBgAAAAHdElNRQfYAR0BKhmnaJzPAAAAG0lEQVQI12NgAAOtVatWMTCohoaGUY+EmIkEAEruEzK2J7tvAAAAAElFTkSuQmCC) repeat}.iceEditor-tableNum{height:30px;line-height:30px;text-align:center;color:#757575}.iceEditor-video{text-align:left}.iceEditor-video label{margin-right:20px;display:inline-block}.iceEditor-video input{margin-right:5px}.iceEditor-video div{height:27px;margin-bottom:10px}.iceEditor-popup .iceEditor-videoUrl{width:380px;height:27px;outline:0;margin-right:0}.iceEditor-content{width:100%;height:100%;padding:20px;position:relative}.iceEditor-content:focus{outline:0}.iceEditor-dragBg{position:absolute;width:100%;height:100%;top:0;left:0;z-index:1;display:none;}.iceEditor-drag{color:#757575;background:#eee;text-align:center;height:12px;line-height:0;cursor:n-resize}.iceEditor-disabled{position:absolute;width:100%;height:100%;top:0;left:0;background:rgba(191,191,191,.79);z-index:99999;display:none}.iceEditor-popup{display:none}.iceEditor-popupMain{width:400px;height:200px;position:fixed;margin:auto;top:0;bottom:0;left:0;right:0;background:#fff;box-shadow:0 1px 1px rgba(0,0,0,.12);z-index:2;animation-name:iceEditorPopup;animation-duration:.5s}.iceEditor-popupBox{width:100%;height:100%;position:fixed;top:0;left:0;background:rgba(0,0,0,.33);opacity:.5;filter:alpha(opacity=50);z-index:1}.iceEditor-popupTitle{width:100%;height:30px;line-height:30px;background:#2f2f2f;padding:0 10px;color:#fff}.iceEditor-popupTitle span{display:inline-block;vertical-align:middle}.iceEditor-popupTitle::before{content:"";display:inline-block;width:10px;height:10px;border-radius:10px;background:#c7f98c;vertical-align:middle;margin-right:8px}.iceEditor-popupClose{float:right;padding:0 10px;color:#fff;font-size:18px;cursor:pointer}.iceEditor-popupClose:hover{color:#8fe5ff}.iceEditor-popupContent{width:100%;padding:10px;color:#000;overflow:auto;float:left}.iceEditor-popupBtn{width:100%;border:0;color:#fff;background:#03A9F4;border-top:1px solid #efefef;padding:0 20px;margin:0;height:35px;text-align:center;line-height:35px;cursor:pointer;margin-top:20px;outline:0}.iceEditor-popupBtn:hover{color:#151515;background:#efefef}@keyframes iceEditorPopup{0%{top:-100px;opacity:0}to{top:0;opacity:1}}@media (max-width:768px){.iceEditor-menu .iceEditor-line{display:none}.iceEditor-popupMain{margin:0!important;width:90%!important;height:90%!important;top:5%!important;left:5%!important}@keyframes iceEditorPopup{0%{margin-top:-50px}to{margin-top:0}}}',ice.editor.svg='',function(){var b,c,a=document.createElement("style"),d=document.body; +a.type="text/css",a.styleSheet?a.styleSheet.cssText=ice.editor.css:a.innerHTML=ice.editor.css,document.getElementsByTagName("head")[0].appendChild(a),b=document.createElement("div"),b.innerHTML=ice.editor.css+ice.editor.svg,ice.editor.svg=null,c=b.getElementsByTagName("svg")[0],c&&(c.setAttribute("aria-hidden","true"),c.style.position="absolute",c.style.width=0,c.style.height=0,c.style.overflow="hidden",d.firstChild?d.firstChild.parentNode.insertBefore(c,d.firstChild):d.appendChild(c))}(); \ No newline at end of file diff --git a/upload.php b/src/upload.php similarity index 100% rename from upload.php rename to src/upload.php diff --git "a/\346\233\264\346\226\260\346\227\245\345\277\227.txt" "b/\346\233\264\346\226\260\346\227\245\345\277\227.txt" new file mode 100644 index 0000000..4b5c545 --- /dev/null +++ "b/\346\233\264\346\226\260\346\227\245\345\277\227.txt" @@ -0,0 +1,98 @@ +#1 更新日志 + +# iceEditor v1.1.6 ++ [2020-06-22 G] ++ [修复] 上传网络图片链接width和height为0的BUG ++ [2020-06-20 G] ++ [修复] textarea内容中的pre代码格式 ++ [新增] 新增代码语言(扩展) ++ [2020-06-17 G] ++ [优化] 添加a链接,可选择新窗口打开 ++ [优化] 下拉菜单,点击exec命令菜单后,弹窗消失 ++ [优化] 新增pre标签下粘贴代码 ++ [优化] 查看源码所造成的一些BUG ++ [2020-06-16 G] ++ [优化] 编辑内容时,结尾出现多余的p标签 ++ [修复] 处于源码视图中,获取到的textarea内容被转义BUG ++ [修复] setValue设置编辑器内容时,如果容器使用的textarea,给它赋值 ++ [2020-06-02 G] ++ [优化] 点击下拉菜单,菜单随之关闭 ++ [优化] 删除线功能,取消strike标签(html5已经废弃),改为style样式控制 ++ [修改] 创建链接弹窗方式 ++ [修改] 添加音乐弹窗方式 + +# iceEditor v1.1.5 ++ [2020-05-29 G] ++ [新增] QQ、微信……截图直接粘贴功能,默认开启此功能,不需要可关闭,配置项:screenshot ++ [新增] 截图直接上传至服务器功能,默认开启此功能,不需要可关闭,配置项:screenshotUpload ++ [重写] 图片、附件上传的核心方法,由iframe方式改为ajax ++ [修改] upload.php文件,支持存储截图的blob对象 ++ [2020-05-22 G] ++ [修复] 拖拽编辑器的高度时,造成鼠标丢失焦点BUG ++ [2020-05-18 G] ++ [修复] 视频上传type未定义BUG ++ [修复] 图片上传完成后造成的iframe为空报错 + + +# iceEditor v1.1.5 ++ [2020-05-29 G] ++ [新增] QQ、微信……截图直接粘贴功能,默认开启此功能,不需要可关闭,配置项:screenshot ++ [新增] 截图直接上传至服务器功能,默认开启此功能,不需要可关闭,配置项:screenshotUpload ++ [重写] 图片、附件上传的核心方法,由iframe方式改为ajax ++ [修改] upload.php文件,支持存储截图的blob对象 ++ [2020-05-22 G] ++ [修复] 拖拽编辑器的高度时,造成鼠标丢失焦点BUG ++ [2020-05-18 G] ++ [修复] 视频上传type未定义BUG ++ [修复] 图片上传完成后造成的iframe为空报错 + +# iceEditor v1.1.4 ++ [2020-04-22 G] ++ [新增] 插件机制,可更好的定制开发菜单栏(开发文档努力写作中,后续贴出,以下贴出简单示例) ++ [新增] 配置项css,可自由设计编辑器的风格样式 ++ [修复] 粘贴文本造成换行BUG ++ [修复] 上个版本升级造成的个别样式错误 ++ [重写] 菜单栏内核,转为插件设计 ++ [优化] 一些逻辑代码,提升加载速度 ++ [优化] 样式代码,精简一部分多余样式 ++ [2020-04-21 G] ++ [修复] 代码查看模式粘贴代码造成空白的BUG + +# iceEditor v1.1.3 ++ [2020-04-20 G] ++ [新增] 添加视频解析功能,可直接添加b站和优酷的播放地址链接(其它视频平台将会陆续添加) ++ [优化] 编辑器样式,全部添加前缀,防止污染 ++ [修复] 附件和图片上传失败所造成的BUG ++ [修复] upload.php文件返回json格式 ++ [2020-04-17 G] ++ [修复] 复制粘贴被转义BUG ++ [2020-04-15 G] ++ [修复] Mac firefox下无法使用BUG ++ [修复] dome文件中A标签未闭合BUG ++ [修改] 默认取消编辑器的光标聚焦 ++ [修改] 编辑器添加默认字体大小 ++ [2020-04-10 G] ++ [修复] Windows firefox下无法使用BUG ++ [修复] uploadUrl没配置的情况下造成死循环BUG ++ [修复] 图片与附件上传关闭弹窗时造成打开其它页面BUG + +# iceEditor v1.1.2 ++ [2020-04-01 G] ++ [精简] 一部分代码 ++ [修复] 粘贴内容BUG ++ [优化] 代码样式 ++ [优化] 上传图片和上传附件方法 ++ [优化] 设置html方法 ++ [优化] 初始化数据代码 + +# iceEditor v1.1.1 ++ [2018-11-12 G] ++ [修复] 粘贴替换编辑器内所有内容BUG + +# iceEditor v1.1.0 ++ [2018-03-13 G] ++ [精简] 代码,优化加载性能 ++ [重写] 图片上传工具(解决form嵌套问题) ++ [重写] 附件上传工具(解决form嵌套问题) ++ [添加] 附件和图片上传提交地址的配置项 ++ [修复] 复制文本没有段落格式BUG \ No newline at end of file