介绍一款Winform中使用的html editor (Html编辑控件),不过这不是一款新控件,它就是.Net平台开发人员所熟知的WebBrowser控件—_—.WebBrowser也可以实现Html编辑和预览功能。
你只需要使用WebBrowser的设计模式去编辑,用第二个WebBrowser去预览即可。
为了实现WebBrowser的设计模式,可以使用如下代码:
这是WYSIWYG编辑器的精简版本,首先创建一个Form窗体,拖放一个WebBrowser控件。然后在Form_Load事件中加入如下代码:
VB语言:
Me.WebBrowser1.Navigate("about:blank")
Application.DoEvents()
Me.WebBrowser1.Document.OpenNew(False).Write("<html><body><div id=""editable"">Edit this text</div></body></html>")
'turns off document body editing
For Each el As HtmlElement In Me.WebBrowser1.Document.All
el.SetAttribute("unselectable", "on")
el.SetAttribute("contenteditable", "false")
Next
'turns on editable div editing
With Me.WebBrowser1.Document.Body.All("editable")
.SetAttribute("width", Me.Width & "px")
.SetAttribute("height", "100%")
.SetAttribute("contenteditable", "true")
End With
'turns on edit mode
Me.WebBrowser1.ActiveXInstance.Document.DesignMode = "On"
'stops right click->Browse View
Me.WebBrowser1.IsWebBrowserContextMenuEnabled = False
C# 语言:
//CODE in C#
webBrowser1.Navigate("about:blank");
Application.DoEvents();
webBrowser1.Document.OpenNew(false).Write("<html><body><div id=\"editable\">Edit this text</div></body></html>");
foreach (HtmlElement el in webBrowser1.Document.All)
{
el.SetAttribute("unselectable", "on");
el.SetAttribute("contenteditable", "false");
}
webBrowser1.Document.Body.SetAttribute("width", this.Width.ToString() + "px");
webBrowser1.Document.Body.SetAttribute("height", "100%");
webBrowser1.Document.Body.SetAttribute("contenteditable", "true");
webBrowser1.Document.DomDocument.GetType().GetProperty("designMode").SetValue(webBrowser1.Document.DomDocument, "On", null);
webBrowser1.IsWebBrowserContextMenuEnabled = false;
在webBrowser1.Document.OpenNew(false).Write() 方法中替换你所需要编辑的Html内容即可。