2012-01-23 54 views
3

嗨我有一個ckeditor的小問題,基本上我需要讓編輯器運行它的html清理命令。 有沒有這樣做的方法。 目前它似乎沒有運行後,我鍵入一些東西到源,然後按保存我希望它整理的HTML,就像它在'正常'編輯器視圖 任何想法? 感謝 理查德用ckeditor整理html

這裏是一些示例代碼

<SCRIPT type=text/javascript src="http://www.johnpricephotography.co.uk/crawler.js"> 
/* Text and/or Image Crawler Script v1.5 (c)2009-2011 John Davenport Scheuer 
    as first seen in http://www.dynamicdrive.com/forums/ 
    username: jscheuer1 - This Notice Must Remain for Legal Use 
    updated: 4/2011 for random order option, more (see below) 
*/ 

</SCRIPT> 
<div class="marquee" id="mycrawler2"> 
    <img alt="Derby wedding photographer - masa restaurant wedding" src="http://johnprice.foliopic.com/images/3539/homepage//226.jpg" style="width: 204px; height: 162px" /> <img alt="Shottle Hall Derby by Nottingham wedding photographer, shottle hall wedding" src="http://www.nottinghamweddingphotography.co.uk/images/sites/3539/gallery/large/049_1314978790.jpg" style="width: 204px; height: 162px" /> <img alt="Shottle Hall wedding Derby wedding by Nottingham wedding photographer" src="http://www.nottinghamweddingphotography.co.uk/images/sites/3539/gallery/large/13150063462954.jpg" style="width: 204px; height: 162px" /> <img alt="derby conference centre wedding by nottingham wedding photographer" src="http://johnprice.foliopic.com/images/3539/homepage//146_1.jpg" style="width: 250px; height: 162px" /> <img alt="professional wedding photographer john price" src="http://johnprice.foliopic.com/images/3539/homepage//31.jpg" style="width: 181px; height: 162px" /> <img alt="Leicestershire wedding photographer john price" src="http://www.nottinghamweddingphotography.co.uk/images/sites/3539/gallery/normal/ian---jo--24-of-62-_1312848448.jpg" style="width: 223px; height: 162px" /> <img alt="Leicestershire wedding photographer john price" src="http://www.nottinghamweddingphotography.co.uk/images/sites/3539/gallery/normal/ian---jo--47-of-62-_1312849131.jpg" style="width: 124px; height: 162px" /> <img alt="Derby river lights holiday inn wedding by derby wedding photographer john price" src="http://www.nottinghamweddingphotography.co.uk/images/sites/3539/gallery/normal/112_1314726892.jpg" style="width: 164px; height: 162px" /> <img alt="alvaston park wedding from derby conference centre wedding" src="http://www.nottinghamweddingphotography.co.uk/images/sites/3539/gallery/normal/163_1311890753.jpg" style="width: 220px; height: 162px" /> <img alt="London uk wedding photographer" src="http://www.nottinghamweddingphotography.co.uk/images/sites/3539/gallery/normal/flashmo-800x450-30_1311894940.jpg" style="width: 215px; height: 162px" /> <img alt="London uk wedding photographer" src="http://www.nottinghamweddingphotography.co.uk/images/sites/3539/gallery/normal/flashmo-800x450-04_1311894907.jpg" style="width: 212px; height: 162px" /></div> 
<div class="marquee"> 
    &nbsp;</div> 
<h1 align="center"> 
    <font face="Times New Roman, Times, serif" size="4"><b><font size="5">By Nottingham Wedding Photographer - John Price, </font></b></font><br /> 
    <span style="color: #a9a9a9"><font face="Times New Roman, Times, serif" size="4"><b><font size="5">&#39;Give me a wedding and I will give you memories&#39;</font></b></font></span></h1> 
<table align="center" border="0" cellpadding="1" cellspacing="1" style="width: 800px"> 
    <tbody> 
     <tr> 
      <td> 
       <p> 
        <br /> 
        <span style="font-size: 14px"><font face="Times New Roman, Times, serif"><span style="color: #000000">Welcome to the&nbsp;website of Nottingham wedding photographer John Price. </span><span style="color: #000000">If you are browsing my website, the chances are that you already are or have recently become engaged. Congratulations. You are now both embarking on an exciting journey together and never before will you have so many choices to make, not least choosing a wedding photographer in nottingham or a wedding photographer in Derby or Leicester and beyond.&nbsp;</span></font></span></p> 
      </td> 
     </tr> 
    </tbody> 
</table> 
<div> 
    &nbsp;</div> 
<SCRIPT type=text/javascript> 
marqueeInit({ 
    uniqueid: 'mycrawler2', 
    style: { 
     'padding': '2px', 
     'width': '840px', 
     'height': '160px' 
    }, 
    inc: 10, //speed - pixel increment for each iteration of this marquee's movement 
    mouse: 'cursor driven', //mouseover behavior ('pause' 'cursor driven' or false) 
    moveatleast: 1, 
noAddedSpace: false, 
    neutral: 106, 
    savedirection: true, 
    random: true 

}); 
</SCRIPT><div> 
    &nbsp;</div> 
<p> 
    <span style="font-size: 16px"><span style="font-family: arial, helvetica, sans-serif">&nbsp;</span></span></p> 
<p> 
    &nbsp;</p> 
<table border="0" cellpadding="1" cellspacing="1" style="width: 800px"> 
    <tbody> 
     <tr> 
      <td> 
       <p> 
        <strong><span style="font-size: 18px"><span style="font-family: arial, helvetica, sans-serif"><strong><span style="font-size: 18px"><span style="font-family: arial, helvetica, sans-serif">Nottingham wedding photographer - John Price<br /> 
        Receives wedding photographer recommedation by Insight Magazine. </span></span></strong></span></span></strong></p> 
       <p style="text-align: center"> 
        <strong><span style="font-size: 18px"><span style="font-family: arial, helvetica, sans-serif">&nbsp;</span></span></strong></p> 
       <p> 
        <strong><span style="font-size: 18px"><span style="font-family: arial, helvetica, sans-serif"><span style="font-size: 12px"><span style="font-family: arial, helvetica, sans-serif">October 2011 edition of the Insight Magazine features a full page recommended article on the wedding photography services that I provide. </span></span></span></span></strong></p> 
       <p> 
        &nbsp;</p> 
       <p> 
        <span style="font-size: 12px"><span style="font-family: arial, helvetica, sans-serif">This is also a privilege for the beautiful bride and grooms which also feature in this article. The photos was all taken from real weddings that I photographed during 2011</span></span></p> 
       <p> 
        &nbsp;</p> 
       <p> 
        <span style="font-size: 12px"><span style="font-family: arial, helvetica, sans-serif">A big thank you to the couples featured.</span></span></p> 
       <p> 
        <span style="font-size: 12px"><span style="font-family: arial, helvetica, sans-serif">Wayne&nbsp;&amp; Katey was married at the Derby Riverlights Holiday Inn, </span></span></p> 
       <p> 
        <span style="font-size: 12px"><span style="font-family: arial, helvetica, sans-serif">Ian &amp; Jo were had an amazing wedding at&nbsp;Shottle Hall, Derby..&nbsp; </span></span></p> 
       <p> 
        <span style="font-size: 12px"><span style="font-family: arial, helvetica, sans-serif">James &amp; Kerry-Ann was married at the Derby Conference Centre.</span></span></p> 
       <p> 
        &nbsp;</p> 
       <p> 
        &nbsp;</p> 
       <p> 
        <span style="font-size: 12px"><span style="font-family: arial, helvetica, sans-serif">You can view a pdf copy of this interview <a href="http://www.johnpricephotography.co.uk/Nottingham Wedding Photographer.pdf"><strong><span style="color: #0000ff"><span style="font-size: 14px">Here</span></span></strong></a>.or see an image <strong><a href="http://www.nottinghamweddingphotography.co.uk/images/sites/3539/gallery/large/1317302692.jpg"><span style="color: #0000ff"><span style="font-size: 14px">Here</span></span></a></strong></span></span></p> 
      </td> 
      <td style="text-align: center"> 
       <img alt="Nottingham Wedding Photographer Recommended By Insight Magazine" src="http://www.nottinghamweddingphotography.co.uk/images/sites/3539/gallery/normal/1317297874.png" style="width: 264px; height: 187px" /></td> 
     </tr> 
    </tbody> 
</table> 
<p> 
    &nbsp;</p> 
<p> 
    &nbsp;</p> 
<p> 
    &nbsp;</p> 
<p> 
    &nbsp;</p> 
<p> 
    &nbsp;</p> 
<p> 
    &nbsp;</p> 
<p> 
    &nbsp;</p> 
<p> 
    &nbsp;</p> 
<p style="text-align: center"> 
    &nbsp;</p> 
<p> 
    <span style="font-size: 12px"><span style="font-family: arial, helvetica, sans-serif">Wedding photographer in Nottingham, Wedding photographer in Derby, Wedding photographer in leicester.</span></span></p> 
<p> 
    <font face="Times New Roman, Times, serif"><font color="#666666"><font color="#666666">John Price is a Nottingham NG based wedding photographer who enjoys capturing that special moment that you know you can look back on time and time again. As a Nottingham wedding photographer, I make no distinction between a Church or Civil Ceremony, Registry Office or Civil Partnerships. Every wedding commands the very best.<span style="display: none">&nbsp;</span></font></font></font></p> 
<p> 
    <font face="Times New Roman, Times, serif"><font color="#666666">Nottingham Wedding Photography, Nottingham Boudoir Photography, Nottingham Portrait Photography, Nottingham Trash The Dress Photography Covering not just Nottingham, Mansfield, Derby, Leicester, Lincolnshire, Peterborough but the whole of the UK</font></font>&nbsp;<span style="display: none">&nbsp;<span style="display: none">&nbsp;</span></span></p> 
<p> 
    &nbsp;</p> 
<p> 
    &nbsp;&nbsp;</p> 
<p> 
    <a href="http://www.nottinghamweddingphotography.co.uk/article/shottle-hall-wedding-photos-of-ian---jo-1963">Shottle Hall Wedding Photos by Derby Wedding Phototographer John Price&nbsp;Photography at shottle hall&nbsp;&nbsp; </a></p> 
<p> 
    <a href="http://www.nottinghamweddingphotography.co.uk/article/the-wedding-of-james---lisa-at-rufford-abbey-country-park-2144">Rufford Abbey Wedding Photos by Nottingham Wedding Phototographer Nottingham Rufford Abbey Country Park.</a></p> 
<p> 
    <a href="http://www.nottinghamweddingphotography.co.uk/article/masa-restaurant-wedding--the-old-chapel--mark---anna-1915">Masa Restaurant Wedding photos Derby wedding photography at Massa Restaurant.</a></p> 
<p> 
    <a href="http://www.nottinghamweddingphotography.co.uk/article/the-derby-conference-centre-wedding---james---kerry-ann-1911">The Derby Conference Centre Wedding photos by Derby wedding photographer John Price Photography</a></p> 
<p> 
    <a href="http://www.nottinghamweddingphotography.co.uk/article/the-wedding-of-craig---sarah-at-the-nottingham-council-house-1906">Nottingham Council House Wedding Photos Photographer</a></p> 
<p> 
    <a href="http://www.nottinghamweddingphotography.co.uk/page/nottingham-boudoir-photographer-1949">Nottingham Boudoir, Derby Boudoir, Leicester Boudoir Photographer</a></p> 

這是如何工作,但我想要做的是固定的HTML,如果出現了問題。 基本上會發生什麼是這個html被保存到一個隱藏的元素,然後當用戶點擊保存它都得到整理出來。 老實說,現在考慮它可能不是處理這個問題的最好方法,但目前只是試圖解決這個問題。 理查德

+0

我想你只需要在保存之前切換到'普通'編輯器視圖。 – Mateo

+0

是的,我知道,但我們正在談論用戶,你無法控制他們。如果你有任何其他想法會很棒。謝謝你的幫助。 –

+0

你是否使用工具欄或自己的embbed'保存'按鈕? – Mateo

回答

4

請儘量保存(只是爲了處理與CKEditor本地數據處理器的數據)之前,請執行下列操作:

var yourEditor = CKEDITOR.instances.yourEditor; 
    // retrieve current data from editor and process it with its dataprocessor 
    var formattedDataForWysiWyg = yourEditor.dataProcessor.toHtml(yourEditor.getData()); 
    // "decode" content processed by ckeditor 
    var sourceData = yourEditor.dataProcessor.toDataFormat(formattedDataForWysiWyg); 
    // set formatted data back 
    yourEditor.setData(sourceData); 

當然,這將是性能比較,如果你做到這一點頻頻命中。

UPDATE: 對不起,我誤導了你一點,但你後面提到的 「{} cke_protected」 我記住了。因此,dataProcessor的「toHtml」方法會執行以下操作:修復損壞的html並將受保護的元素(腳本,flash)封裝到特殊代碼結構中,以禁止通過wysiwyg模式進行編輯,但是當源模式中顯示相同的html時,編輯器會使用「 toDataFormat「方法來刪除所有與ckeditor相關的代碼結構。所以,看看我上面的更新。

更新2: 新的解決方案適用於0123.的3.6.2和3.5.3版本。

+0

這似乎有竅門,所以我會選擇這個! –

+0

對不起,它似乎工作,然後用戶帶了一個非常長的一段HTML,它不想工作! 我想這是回到繪圖板 - 感謝您的幫助。 –

+0

理查德,你可以請某種方式提供它不工作的HTML樣本,我會試圖找出發生了什麼? –