使用IFrame框架做成文本编辑器。
需要两个页面：default.html和editInfo.aspx页面，其中default.aspx作为主控页面，editInfo.html作为编辑页面。
default.aspx页面中要包括一个iframe框架，以包含编辑页面。
下面给出两个页面的代码：
default.aspx -------------
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>Visual Studio 2005 WEB控件功能说明及演示</title>
<link href="css/styles.css" type="text/css" rel="stylesheet" />
<script language="javascript" type="text/javascript">
<!--
function ShowExample(pageName)
{
document.getElementById('examplePage').src = "WebControlExample/" + pageName + ".aspx";
}
// 将IFrame包含的页面设置为可编辑
function ToLoad()
{
document.getElementById("examplePage").contentWindow.document.body.contentEditable = true;
}
// 将编辑页面中的内容显示到文本框中
function ToShowTextFromIFrame()
{
document.getElementById("SaveText").value = document.getElementById("examplePage").contentWindow.document.body.innerText;
}
// 将编辑页面中的HTML代码显示到文本框中
function ToShowHTMLFromIFrame()
{
document.getElementById("SaveHTML").value = document.getElementById("examplePage").contentWindow.document.body.innerHTML;
}
// 将文本框中的内容写入编辑页面中
function ToWriteTextToIFrame()
{
document.getElementById("examplePage").contentWindow.document.body.innerText = document.getElementById("WriteText").value;
}
// 将文本框中的HTML代码写入编辑页面中
function ToWriteHTMLToIFrame()
{
document.getElementById("examplePage").contentWindow.document.body.innerHTML = document.getElementById("WriteHTML").value;
}
//-->
</script>
</head>
<body>
<form id="form1" runat="server">
<iframe id="examplePage" src="comm/fristpage.html" style="width: 100%; height: 100%"
scrolling="auto" οnlοad="ToLoad();"></iframe>
<input id="SaveText" type="text" /><input type="button" id="bttnSaveText" value="显示IFrame文本"
οnclick="ToShowTextFromIFrame();" />
<input id="WriteText" type="text" /><input type="button" id="bttnWriteText" value="写入IFrame文本"
οnclick="ToWriteTextToIFrame();" />
<br />
<input id="SaveHTML" type="text" /><input type="button" id="bttnSaveHTML" value="显示IFrameHTML文本"
οnclick="ToShowHTMLFromIFrame();" />
<input id="WriteHTML" type="text" /><input type="button" id="bttnWriteHTML" value="写入IFrameHTML文本"
οnclick="ToWriteHTMLToIFrame();" />
</form>
</body>
</html>
editInfo.html -----------------------------
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
<title>无标题页</title>
</head>
<body>
<form id="form1" runat="server">
<div>
<table style="width: 100%; height: 100%">
<tr>
<td align="center" valign="middle">
Hello everyone !</td>
</tr>
</table>
</div>
</form>
</body>
</html>
注意：编辑页面最好选用HTML的静态页面，如果选用动态页面的话，编辑页面被设置为可编辑后将会自动增加一个文本框以保存StateView内容。