silverlight 调用html5,Silverlight嵌入Html并调用该Html中的Javascript

本文将分两步进行说明，第一步说明如何在silverlight的xaml脚本中加入html。第二步说如何在silverlight中调用html中的javascript函数。说明：vs2010 ultimate + silverlight5

本文中所有代码都可以在github中查看，git版本中采用了master-dev的方式。在master中可以查看每一个demo的最后完成，在dev中可以查看每一步的代码。

github地址：git@github.com:kiwiwin/silverlight-demo.git。文件夹名称htmlhost-javascript-demo

一、在xaml中加入html

1.在xaml中加入一个HtmlHost Control，显示的内容就是hello.html中的内容，是“hello，kiwi_coder”

2.为了使用HtmlHost，需要将silverlightControlHost设为windowless，这里我删除了.aspx，只用了.html：添加如下

最后的silverlightControlHost：

3.run，显示如图：

二、在silverlight中调用html中的javascript函数

1.在hello.html定义一个名为sayHello的函数，该函数被调用时，弹出一个提示信息，显示“Hello，kiwi_coder”.

function sayHello() {

alert("Hello, kiwi_coder");

}

2.为了方便，在silverlight所在的htmlhost-javascript-demoTestPage.html中定义一个函数askHtmlSayHello.说明：HtmlHost是自动在htmlhost-javascript-demoTestPage.html中最后添加了一个iframe，所以取最后一个即是html所在的iframe。

function askHtmlSayHello() {

window.frames[window.frames.length-1].sayHello();

}

3.在MainPage.xaml中添加一个button用来调用html中的javascript函数：

public partial class MainPage : UserControl

{

//... private void SayHello(object sender, RoutedEventArgs e)

{

HtmlPage.Window.Invoke("askHtmlSayHello");

}

}

4.run