Silverlight与html网页、javascript交互
4.8 网页交互
Silverlight应用程序并不是孤立存在的，通常宿主在ASP.NET网站中，由aspx或html网页承载。因此Silverlight与ASP.NET网站的交互，与HTML元素以及JavaScript函数的交互非常重要。
4.8.1 参数传递
在实际的应用程序中，经常需要从配置文件传递参数，在Silverlight应用中，传递参数可以通过插件对象的initParams属性指定，也可以从查询字符串获取。
n
initParams方式：
²
在ApplicationStartup 事件中通过StartupEventArgs 参数获取。
²
在程序其他位置以App.Current.Host.InitParams 属性获取。
² 示例：
下面代码指定了一个初始化参数，MapServiceUrl
<object
data="data:application/x-silverlight-2,"
type="application/x-silverlight-2" width="100%"
height="100%">
<param
name="source" value="ClientBin/MapExport.xap"/>
<param
name="initParams" value="MapServiceUrl=<%=
ConfigurationManager.AppSettings["MapServiceUrl"]%>"/>
<param
name="onError" value="onSilverlightError" />
<param
name="minRuntimeVersion" value="4.0.50826.0" />
<param
name="autoUpgrade" value="true" />
</object>
初始化参数调用：
private
void Application_Startup(object sender, StartupEventArgs e)
{
string url = e.InitParams["MapServiceUrl"];
this.RootVisual
= new MainPage(url);
}
n 查询字符串方式：
即通过HtmlDocument.QueryString直接获取HTML页面的查询参数。
4.8.2 HTML访问Silverlight
从HTML访问Silverlight，主要通过事件机制来实现。主要步骤如下：
1) 在HTML中声明HTML元素：
<input
id="btnChangeBackground" value="改变SL背景" type="button" />
2) 在Silverlight中注册按钮事件：
HtmlElement
btnChangeBackground=HtmlPage.Document.GetElementById(
"btnChangeBackground");
btnChangeBackground.AttachEvent("onclick",
new EventHandler<
HtmlEventArgs>(btnChangeBackground_Click));
3) 添加事件处理函数逻辑：
void btnChangeBackground_Click(object sender, HtmlEventArgs e)
{
HtmlElement
button = sender as HtmlElement;
LayoutRoot.Background
= new SolidColorBrush(Colors.Black);
}
4.8.3 Silverlight访问HTML
在Silverlight中，HtmlPage表示HTML页面，HtmlElement表示HTML元素，通过HtmlPage.Document.GetElementById获取要调用的HTML元素，然后执行相应的操作。
示例：
HtmlElement txtTitle = HtmlPage.Document.GetElementById("txtTitle");
txtTitle.SetAttribute("value",
"通过Silverlight设置的值");
txtTitle.SetAttribute("fontSize",
12);
4.8.4 JavaScript访问Silverlight
从JavaScript函数访问Silverlight中的对象、方法，主要步骤如下：
1) 首先在HTML中为Silverlight插件对象指定名称：
<object
id="SLObject" data="data:application/x-silverlight-2,"
type="application/x-silverlight-2" width="75%"
height="100%">
2) 为HTML元素指定事件处理函数：
<input
id="btnTurnLeft" value="向左转动" type="button"
onclick="turnCircle(true)"/>
3) 在事件处理函数中调用Silverlight对象：
function
turnCircle(isLeft) {
var slobj = document.all('SLObject');
slobj.content.SLDataAccess.TurnImage(isLeft);
}
4) 编写Silverlight中的函数（注意ScriptableMember标记了该函数可在脚本中调用）：
[ScriptableMember]
public
void TurnImage(bool bLeft)
{
„„
}
5) 在Silverlight代码中注册脚本函数：
HtmlPage.RegisterScriptableObject("SLDataAccess",
this);
4.8.5 Silverlight访问JavaScript
在Silverlight代码中也可以调用网页中的JavaScript函数，通过页面的Invoke方法，或者脚本对象的InvokeSelf方法均可。
n 页面调用方式：
tmlPage.Window.Invoke("showMessage",
"Silverlight中通过页面调用");
n 脚本对象方式：
ScriptObject
jsObj = (ScriptObject)HtmlPage.Window.GetProperty("showMessage");
jsObj.InvokeSelf("Silverlight中通过脚本对象调用");
n JavaScript函数：
function
showMessage(message) {
alert(message);
}
