中山php|最優網絡 ：中山做網站 中山php建站
最優良人
Posts Tagged With: Xheditor
異步加載可視化編輯器 Xheditor
2011/08/15 at 01:02 » Comments (6)
如果像上一篇文章使用基于Jquery的可視化編輯器 Xheditor 那樣設置的話，訪問頁面時會加載70多k的jquery文件和50多k的xheditor文件，為了追求頁面默認加載的性能提升，其實這些文件完全可以在編輯的時候異步加載的，下面是操作步驟： 1，需要用到一個異步加載js文件并執行的函數 function getJsFile(url, callBack){ var XH = window.XMLHttpRequest ? new XMLHttpRequest : new ActiveXObject('Msxml2.XMLHTTP'); XH.open('get',url,true); XH.onreadystatechange = function(){ if(XH.readyState == 4 && XH.status == 200){ if(window.execScript) window.execScript(XH.responseText); else eval.call(window, XH.responseText); eval(callBack); } ...more »使用基于Jquery的可視化編輯器 Xheditor
2011/08/15 at 01:00 » Comments (19)
使用方法 1. 下載xhEditor最新版本。 下載地址：http://code.google.com/p/xheditor/downloads/list 2. 解壓壓縮文件，將其中的xheditor.js以及xheditor_emot、xheditor_plugins和xheditor_skin三個文件夾上傳到網站相應目錄 3. 在相應html文件的</head>之前添加 <script type="text/javascript" src="http://static.xxx.com/js/jquery.js"></script> <script type="text/javascript" src="http://static.xxx.com/js/xheditor.js"></script> 4. 方法1：在textarea上添加屬性： class="xheditor {skin:'default'}"，前面主參數也可以是xheditor-mini和xheditor-simple，分別加載迷你和簡單工具欄，后面詳細參數可以省略 方法2：在您的頁面初始JS代碼里加上： $('#elm1').xheditor(); $('#elm1').xheditor()； 例如： $({ $('#elm1').xheditor()； }); 相應的刪除編輯器的代碼為 $('#elm1').xheditor(false)； 重要說明：2種初始化方法只能選擇其中一種，不能混合使用，優先級分別是：方法1>方法2，例如用了方法1，方法2就無法使用了 更多幫助信息，請查看在線幫助：http://code.google.com/p/xheditor/wiki/Help 或者參考demos文件夾中的演示頁面 建議使用wizard.html初始化代碼生成向導來生成適合你的代碼。 more »異步加載 Xheditor 的時候遇到的瀏覽器兼容問題
2011/08/14 at 02:55 » Comments (20)
由于各個瀏覽器對js代碼的異步執行函數的支持不一樣 window.execScript() 只支持IE瀏覽器 eval() 雖然支持各個瀏覽器，但是卻不能在全局執行 解決的方法是利用javascript里面有一個改變上下文環境的關鍵字with . 把GetJsFile方法改成如下： function getJsFile(url, callBack){ var XH = window.XMLHttpRequest ? new XMLHttpRequest : new ActiveXObject('Msxml2.XMLHTTP'); XH.open('get',url,true); XH.onreadystatechange = function(){ if(XH.readyState == 4 && XH.status == 200){ with ( window )eval(XH.responseText); //if(window.execScript) window.execScript(XH.responseText); //else eval.call(window, XH.responseText); with ...more »返回菜單
