ewebeditor_その他の特殊効果に似た、IE および FF と互換性のある、私が作成したオンラインテキストエディター

なんというか、夜を終えたばかりで、とても疲れているはずですが、文字を入力する体力はまだ残っており、まだ終わっていないようです。 早速ですが、私は最近、ewebeditor に似たオンライン エディターを作成しました。もちろん他のものほど強力ではありませんが、基本的な機能が備わっており、IE や FF とも互換性があります。これは、すぐにコードを取り出しましょう demo.html :

コードをコピーします コードは次のとおりです: フォント: 宋体 Helvetica Kaili script 模倣歌王朝 公式台本 ヨウユアン 新曲スタイル 興明スタイル Arial Arial Black ブラッドリー ハンド ITC ブラシ スクリプト MT Century Gothic Comic Sans MS Courier MS Sans Serif スクリプト システム Times New Roman Viner Hand ITC Verdana ワイド ラテン語 Wingdings フォント サイズ: 1 2 3 4 5">5 ; 6 gt; 7 /button> ="italic() ">チルト Left Center right ムービーと写真を挿入 ファイルをアップロード テーブルを挿入/button> 水平線を挿入 ハイパーリンクを挿入 ;/td>

core.js :

コードをコピー コードは次のとおりです: sx={}; sx.comm={}; sx.comm.string=function(){ if(!String.prototype.left){ String.prototype.left=function(l){ return this.substr(0, l); } } if(!String.prototype.right){ String.prototype.right=function(l){ return this.substr(this.length-l,l ); } } if(!String.prototype.trim){ String.prototype.trim=function(){ return this.replace(/^/s |/s $ /g,""); } } }(); sx.comm.array=function(){ if(!Array.prototype.indexOf){ Array.prototype.indexOf=function(data){ for(var i=0; i if(this[i]==data){ break; } } return i==this.length?-1:i; } } if(!Array.prototype.lastIndexOf){ Array.prototype.lastIndexOf=function(data){ for(var i=this.length-1;i&gt ;=0;i--){ if(this[i]==data){ ブレーク; } } return i; } } if(!Array.prototype.clone){ Array.prototype.clone=function(){ var temp=[]; for(var i=0;i if(this[i] instanceof Array){ temp[i]=this[i].clone(); }else{ temp[i]=this[i]; } } 温度を返します。 } } if(!Array.prototype.every){ Array.prototype.every=function(o,f){ for (var i = 0; i if (this[i] 配列のインスタンス) { this[i].every(o,f); } else { f.call(o, this[i]); } } } } }(); sx.comm.ver=function(){ try{ HTMLElement; 「ff」を返します; }catch(e){ return "ie"; } }(); sx.comm.ext=function(){ if(sx.comm.ver=="ff"){ HTMLElement.prototype.__defineGetter__("outerHTML",function(){ var attr; var attrs=this.attributes; var str=" attr=attrs[i]; if(attr.specified) str =" " attr.name '="' attr.value '"' } if(! this.canHaveChildren) return str ">" this.innerHTML " "; HTMLElement.prototype.__defineGetter__("canHaveChildren",function(){ switch(this.tagName.toLowerCase()){ case "エリア": case "base": case "basefont": case "col": case "frame": case "hr": case "img": case "br": case " input": case "isindex": case "link": case "meta": case "param": return false; } return true ; }); XMLDocument.prototype.selectNodes = Element.prototype.selectNodes = function (){ //alert(arguments[0]); var oNSResolver = this.createNSResolver(this.documentElement) var aItems = this.evaluate(arguments[0].toLowerCase(), this, oNSResolver, XPathResult.ORDERED_NODE_SNAPSHOT_TYPE, null) var a結果 = []; for( var i = 0; i { aResult[i] = aItems.snapshotItem(i); } //alert(aItems.snapshotLength); Result を返します。 } } }(); sx.event={}; sx.event.target=function(){ if(window.event){ return window.event.srcElement; }else{ var f=arguments.callee.caller; while(f){ if(f.arguments[0] instanceof Event){ return f.arguments[0].target; } f=f.caller; } } } sx.event.event=function(){ if (window.event) { return window.event; }else{ var f=arguments.callee.caller; while (f) { if (f.arguments[0] instanceof Event) { return f.arguments[0]; } f = f.caller; } } } sx.event.relativetarget=function(){ if(window.event){ if(window.event.type=="mouseover" ){ return window.event.fromElement; }else if(window.event.type=="mouseout"){ return window.event.toElement; } }else{ var f=arguments.callee.caller; while (f) { if (f.arguments[0] instanceof Event) { return f.arguments[0].popularTarget; } f = f.caller; } } } sx.event.stopevent=function(){ if (window.event) { window.event.returnValue=false; window.event.cancelBubble=true; }else{ var f=arguments.callee.caller; while(f){ if(f.arguments[0] instanceof Event){ break; } f=f.caller; } f.arguments[0].preventDefault(); f.arguments[0].stopPropagation(); } } sx.event.addevent=function(e,t,f){ if(!arguments.callee.event){ arguments.callee.event=[] ; } if(e.attachEvent){ e.attachEvent("on" t,f); }else{ e.addEventListener(t,f,false); } arguments.callee.event.push(f); return argument.callee.event.length-1; } sx.event.removeevent=function(e,t,i){ if(e.detachEvent){ e.detachEvent("on" t,sx.event.addevent.イベント[i]); }else{ e.removeEventListener(t,sx.event.addevent.event[i],false); } sx.event.addevent.event[i]=null; } sx.event.parseevent=function(e,t){ if (sx.comm.ver=="ie"){ e.fireEvent("on" t); }else{ var evt = document.createEvent("イベント"); evt.initEvent(t, true, true); e.dispatchEvent(evt); } } sx.dom={}; sx.dom.text=function(e){ return this.e.innerText?this.e.innerText:this.e.innerHTML.replace(// /igm 、「」）; } sx.dom.elementnodes=function(e,flag){ var temp=[]; var a=e.childNodes; for(var i=0;i if(a[i].nodeType==flag){ temp.push(a[i]); } } 温度を返します。 } sx.dom.elementallnodes=function(e,flag){ var temp=[]; var a=e.getElementsByTagName("*"); for(var i=0;i if(a[i].nodeType==flag){ temp.push(a[i]); } } 温度を返します。 } sx.dom.xpath=function(e,mode){ p=e.cloneNode(true); var s=p.getElementsByTagName("スクリプト"); for(var i=0;i p.replaceChild(s[i].cloneNode(false),s[i]); var html=p.outerHTML.replace(//=(?!"|')(.*?)(?=/s|>)/ig,"=/"$1/""); if(window.ActiveXObject){ var x=new ActiveXObject("Msxml2.DOMDocument"); x.async=false; x.loadXML(" html); }else{ var oParser = new DOMParser(); var x = oParser.parseFromString(html,"text/xml"); //alert(x.documentElement.tagName) var div=x.selectNodes(mode); (div.length); var temp=[]; var a1=x.selectNodes(e.tagName.toUpperCase() "//*"); ; var all=e.getElementsByTagName("*"); var i1=0; ;i ){ //alert(i); if(a1[i]==div[i1]){ temp.push(all[i]); 🎜>} } x=null; 戻り温度; sx.dom.left=function(e){ if(document.getBoundingClientRect){ return e.getBoundingClientRect().left; }else{ var a=e; while(a){ left =a.offsetLeft; 🎜>a=a.offsetParent; } 左に戻る; } } sx.dom.top = function(e){ if(document.getBoundingClientRect){ return e.getBoundingClientRect().top; }else{ var a=e; varトップ=0; while(a){ top =a.offsetTop; a=a.offsetParent; } トップに戻る; } } sx.dom.getstyle=function(e,prop){ if(e.currentStyle){ return e.currentStyle[prop]; }else{ return document.defaultView.getComputedStyle(e,null).getPropertyValue(prop); } } sx.dom.setstyle=function(e,data){ for(var i in data){ e.style[i]=data[i]; } } advance.js： var $=function(id){ return document.getElementById(id); }

edit.js ：

复制代

代以下のように: var w=$("content").contentWindow; w.document.designMode="on"; w.document.open(); w.document.write(" ") w.document.close(); if(sx.comm.ver=="ie"){ //w.document.body.style.lineHeight="10px"; } w.document.onkeydown=function(){ if(sx.comm.ver=="ie"){ if(w.event.keyCode==13){ var s=w.document.selection.createRange(); s.pasteHTML(" "); w.focus(); false を返します。 } } } function wnd(){ var main=document.createElement("div"); sx.dom.setstyle(main,{ position:"absolute", width:"100%", height:"100%", backgroundColor:"lightblue", フィルター:"alpha(opacity=50)", opacity:0.5 }); var body=document.createElement("div"); sx.dom.setstyle(body,{ position:"absolute", width:"200px", height:"250px", backgroundColor:"green", zIndex:1000 }); var title=document.createElement("div"); sx.dom.setstyle(title,{ width:"200px", height:"20px", backgroundColor:"blue", }); var close=document.createElement("span"); sx.dom.setstyle(close,{ marginLeft:"180px", display:"block", width:"20px", height:"20px", textAlign:"センター", カーソル:"ポインター" }); close.innerHTML="X"; close.onclick=function(){ main.parentNode.removeChild(main); body.parentNode.removeChild(body); } title.appendChild(close); body.appendChild(タイトル); var content=document.createElement("div"); sx.dom.setstyle(content,{ width:"200px", height:"230px" }); body.appendChild(コンテンツ); this.show=function(e){ document.body.appendChild(main); sx.dom.setstyle(main,{ top:"0px", left:"0px" }); document.body.appendChild(body); sx.dom.setstyle(body,{ top:sx.dom.top(e) e.clientHeight "px", left:sx.dom.left(e) e.clientWidth "px "、 }); } this.close=close; this.main=メイン; this.body=body; this.title=タイトル; this.content=コンテンツ; } function PDF(){ w.document.execCommand("bold",null,null); } function italic(){ w.document.execCommand("italic",null,null); } function left(){ w.document.execCommand("JustifyLeft",null,null); } function center(){ w.document.execCommand("Justifycenter",null,null); } function right(){ w.document.execCommand("Justifyright",null,null); } function FontName(value){ w.document.execCommand("FontName", false, value); } function FontSize(value){ w.document.execCommand("FontSize", false, value); } function inserthr(){ if(document.selection){ w.focus(); var s=w.document.selection.createRange(); s.pasteHTML(" "); }else{ w.focus(); var s=w.getSelection().getRangeAt(0); s.insertNode(w.document.createElement("hr")); } } function insertlink(){ if (document.selection) { w.focus(); var s = w.document.selection.createRange(); } else { w.focus(); var s = w.getSelection().getRangeAt(0); } var e=sx.event.target(); var ww=new wnd(); ww.content.appendChild(document.createTextNode("请输入链接地址;")); var link=document.createElement("input"); link.type="テキスト"; リンク.サイズ=20; ww.content.appendChild(リンク); var b=document.createElement("ボタン"); b.innerHTML="确定"; ww.content.appendChild(b); b.onclick=function(){ if(sx.comm.ver=="ie"){ s.pasteHTML(" " s.htmlText " "); } else{ var a=w.document.createElement("a"); a.href=link.value; s.surroundContents(a); } sx.event.parseevent(ww.close,"click"); } ww.show(e); } function inserttable(){ if (document.selection) { w.focus(); var s = w.document.selection.createRange(); } else { w.focus(); var s = w.getSelection().getRangeAt(0); } var e=sx.event.target(); var ww=new wnd(); ww.content.appendChild(document.createTextNode("请输入行数;")); var tr=document.createElement("input"); tr.type="テキスト"; tr.size=20; ww.content.appendChild(tr); ww.content.appendChild(document.createElement("br")); ww.content.appendChild(document.createTextNode("请输入列数;")); var td=document.createElement("input"); td.type="テキスト"; td.size=20; ww.content.appendChild(td); ww.content.appendChild(document.createElement("br")); ww.content.appendChild(document.createTextNode("请输入单元格高;")); var height=document.createElement("input"); 高さ.type="テキスト"; 高さ.サイズ=20; ww.content.appendChild(高さ); ww.content.appendChild(document.createElement("br")); ww.content.appendChild(document.createTextNode("请输入单元格宽度;")); var width=document.createElement("input"); width.type="テキスト"; width.size=20; ww.content.appendChild(width); ww.content.appendChild(document.createElement("br")); var b=document.createElement("ボタン"); b.innerHTML="确定"; ww.content.appendChild(b); b.onclick=function(){ var l1=Number(tr.value); var l2=数値(td.value); var h1=数値(高さ.値); var w1=数値(幅.値); ww.content.appendChild(document.createTextNode("请输入单元格高;")); var t=document.createElement("テーブル"); t.border="1"; var tb=document.createElement("tbody"); t.appendChild(tb); for(var i=0;i var tr1=document.createElement("tr"); for(var i1=0;i1 var td1=document.createElement("td"); td1.innerHTML=""; sx.dom.setstyle(td1,{ width:w1 "px", height:h1 "px" }); tr1.appendChild(td1); } tb.appendChild(tr1); } if(sx.comm.ver=="ie"){ s.pasteHTML(t.outerHTML); } else{ s.insertNode(t); s.insertNode(document.createElement("br")); } sx.event.parseevent(ww.close,"click"); } ww.show(e); } function color(){ var e=sx.event.target(); if (document.selection) { w.focus(); var s = w.document.selection.createRange(); } else { w.focus(); var s = w.getSelection().getRangeAt(0); } var ww=new wnd(); var Colors = ["00","33","66","99","CC","FF"]; var cp=document.createElement("span"); sx.dom.setstyle(cp,{ display:"inline-block", width:"10px", height:"10px", margin:"2px" }); for(var i1=5;i1>=0;i1--){ for(var i2=5;i2>=0;i2--){ for(var i3=5; i3>=0;i3--){ var cp1=cp.cloneNode(true); cp1.style.backgroundColor="#" カラー[i1] カラー[i2] カラー[i3]; cp1.title="#" カラー[i1] カラー[i2] カラー[i3]; cp1.onclick=function(){ if(sx.comm.ver=="ie"){ w.focus(); s.pasteHTML(" " s.htmlText " "); } else{ var a=w.document.createElement("font"); a.color=this.title; s.surroundContents(a); } sx.event.parseevent(ww.close,"click"); } ww.content.appendChild(cp1); } } } ww.show(e); } 关键是demo.html和edit.js里の代码，core.jsおよびadvance.js里の代码是我是兼容浏览器写的，本想把它扩展

このプロセッサには、サーバー技術が必要なため、画像やファイルの上向き転送が実現されていません。 私たちは Web の公開を計算し、vc を中心に探求を開始し、できるだけ画像サンプルを書き込むことができるプログラムを完成させ、その後、時間があれば、このブラウザーと JavaScript 互換性を継続的に実行するつもりです。 恩、好んで油を加えます。

ewebeditor_その他の特殊効果に似た、IE および FF と互換性のある、私が作成したオンライン テキスト エディター

ewebeditor_その他の特殊効果に似た、IE および FF と互換性のある、私が作成したオンラインテキストエディター