2010-03-18 66 views
3

我正在嘗試顯示HTML電子郵件的「預覽」。我有我的數據庫中的HTML,現在我需要在iframe或彈出窗口或其他東西。我試圖將html注入到頁面上的div標籤,但它不會顯示任何內容。下面是我遇到了(我有嵌套的HTML標記)的問題:因爲你不能有一個文檔中兩個HTML結構將無法工作如何顯示HTML電子郵件在網頁上預覽?

<html> 
    <body> 
     <h1>My page</h1> 
     <div id="email-body"> 
      <html> 
       <body> 
        <p>email</p> 
       </body> 
      </html> 
     </div> 
    </body> 
</html> 
+0

你可以解析它並只顯示身體內容嗎?也許使用jquery來加載電子郵件的整個DOM,然後選擇body標籤的內容並將它們添加到您的div中。 – 2010-03-18 22:00:14

回答

2

您可以將HTML寫入彈出窗口。

var preview = window.open("", /* options */); 
preview.document.write(html); 
preview.document.close(); 

但是和我一樣,很多人不喜歡彈出窗口。另一個考慮是隻顯示只有<body>的內容。更好的是,大多數郵件客戶端只是支持它。如果內容類型爲text/html,則可以發送HTML郵件,就好像它將成爲HTML <body>的一部分。

<p>email</p> 

這樣你就可以預覽,只需要在主頁面的某個div中注入它通常的方式。

如果你喜歡風格的元素,但不喜歡內聯樣式,你還可以添加<style>元素。大多數這些郵件客戶端也只是支持它。

<style>p { font-family: arial, sans-serif; }</style> 
<p>email</p> 

從HTML純粹主義者的觀點來看,這確實在語法上是無效的。但它的工作原理(也在網頁瀏覽器中),並且可以大大簡化這些內容。

+0

嘿,這也是一個不錯的主意 - 但是你必須逃避(並重新使用)正在寫入的HTML。您可以將相同的邏輯應用於IFRAME。 – 2010-03-18 22:59:02

0

做到這一點,我可以看到的唯一方法是使用iframe

+0

這就是我正要說的。唯一的問題是你不能「嵌入」在'