Question

我正在使用textarea，我允许用户输入他的HTML。

当用户输入HTML时，有一个预览选项（按钮），当用户点击预览按钮时，则textarea被隐藏，html显示在div中。

当用户输入一些带有body标签的html时，页面的设计会受到干扰。

任何解决方法

我面临的问题是何时生成预览。

演示HTML

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Contest Announcement</title>
<style type="text/css">

body{width:100% !important; -webkit-text-size-adjust:100%; -ms-text-size-adjust:100%; margin:0 auto; padding:0; background-color:#FFFFFF;}
#outlook a {padding:0;} 
#backgroundTable {margin:0; padding:0; width:100% !important; line-height: 100% !important;}
.ExternalClass {width:100%;}
.ExternalClass, .ExternalClass p, .ExternalClass span, .ExternalClass font, .ExternalClass td, .ExternalClass div {line-height: 100%;}

img {outline:none; text-decoration:none; -ms-interpolation-mode: bicubic; display:block; border:none;} 
p {margin: 1em 0;}
table td {border-collapse: collapse;}

.symbolfix img{width:10px !important;height:10px !important;}

</style>

</head>

<body style="width:100% !important; -webkit-text-size-adjust:100%; -ms-text-size-adjust:100%; margin:0 auto; padding:0; background-color:#FFFFFF;">

Answer 1

这可能不是最理想的，但为什么不尝试使用javascript＆amp; jQuery将文本区域的内容分配给iframe？这是一个帖子的链接，详细说明了如何将HTML注入iframe。

putting html inside an iframe (using javascript)

Answer 2

您可以使用WYSIWYG编辑器轻松完成此任务。

结帐Redactor

如何在mvc中预览textarea中的html

2 个答案: