网页编辑器 DIY (转)

网页编辑器 DIY (转)[@more@]

  网页编辑器 DIY 

  DreamWeaver、FrontPage 等网页编辑制作工具我们早已耳熟能详。但是你有没有想过亲自动手制作一个我们自己的“网页编辑器”呢?

  Delphi 中自带的 webBrowser 控件可以使我们梦想成真,而且实现起来一点也不困难。

  首先建立一个新工程,在 Form1 上拖一个 PageControl 控件,建立 2 个 TabSheet 即 TabSheet1 和 TabSheet2。再在 TabSheet1 上拖放 RichEdit1 控件,在 TabSheet2 上拖放 WebBrowser1 控件。这几个控件的基本属性设置为:
  TabSheet1:Caption='HTML代码'
  TabSheet1:Caption='预览'
  RichEdit1:Align=alClient
  WebBrowser1:Align=alClient

  RichEdit 用于编写 HTML 代码,WebBrowser 对代码进行可视化预览。程序在初始化阶段提供了一个基本的网页模板,我们可以在此基础上编写的 HTML 代码。程序的核心代码就是
  WebBrowser1.Oleobject.Document.body.innerHTML :=sHTML;
这一句,如果再仔细发掘,肯定还能找出更有用的功能来。附图是本程序运行的示例截图。

  本程序在 win98、Delphi5.0、IE5.0 环境下实现。程序的完整代码如下:
  unit Unit1;
  interface
  uses
  windows, Messages, SysUtils, Classes, Graphics, Controls,
  Forms, Dialogs, StdCtrls, OleCtrls, SHDocVw, ComCtrls;
  type
  TForm1 = class(TForm)
  PageControl1: TPageControl;
  TabSheet1: TTabSheet;
  TabSheet2: TTabSheet;
  WebBrowser1: TWebBrowser;
  RichEdit1: TRichEdit;
  procedure FormCreate(Sender: TObject);
  procedure TabSheet2Show(Sender: TObject);
  private { Private declarations }
  public { Public declarations }
  end;
  var
  Form1: TForm1;
  Const
  lf = #10; //换行符
  implementation
  {$R *.DFM}

  procedure TForm1.FormCreate(Sender: TObject);
  begin
  //设置窗口标题:
  Caption :='网页编辑器DIY';
  //初始化WebBrowser
  WebBrowser1.Navigate('about:blank');
  //产生网页代码模板:
  RichEdit1.Text :=''+lf
  +''+lf
  +''+lf+lf
  +''+lf
  +'';
  end;

  procedure TForm1.TabSheet2Show(Sender: TObject);
  var sHTML: string;
  begin
  sHTML :=RichEdit1.Text;
  WebBrowser1.OleObject.Document.body.innerHTML :=sHTML;
  end;
  end.
  ------------------------------------------------
  张庆 EMail: .NET" rel="nofollow">zhangking@263.net
  http://soft.why100000.com


来自 “ ITPUB博客 ” ,链接:http://blog.itpub.net/10748419/viewspace-963220/,如需转载,请注明出处,否则将追究法律责任。

转载于:http://blog.itpub.net/10748419/viewspace-963220/

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值