概述
Silverlight 2 Beta
1版本发布了,无论从Runtime还是Tools都给我们带来了很多的惊喜,如支持框架语言Visual Basic, Visual C#,
IronRuby, Ironpython,对JSON、Web
Service、WCF以及Sockets的支持等一系列新的特性。《一步一步学Silverlight 2系列》文章将从Silverlight
2基础知识、数据与通信、自定义控件、动画、图形图像等几个方面带您快速进入Silverlight 2开发。
Silverlight中
内置了对于HTML、客户端脚本等的支持。很多情况下,我们编写的Web应用程序中用了一些JavaScript或者AJAX框架,我们希望能够在
Silverlight调用某些脚本方法,或者说在Silverlight中触发某个脚本的执行,这时就需要用到在Silverlight中调用
JavaScript,本文将简单介绍这一内容。
使用GetProperty获取脚本对象
先来看一个简单的例子,在Silverlight测试页面中放入一个div用作显示信息:
<divid="result"></div>
编写一段简单的JavaScript代码:
<script.type="text/javascript">ITPUB个人空间d:^3J(ZJ[
S
functionHello(message)
x3Nm*c9OW
T0{
!a+vo:OW:{-kq0varresultSpan = $get("result");ITPUB个人空间Hl0h_)GW9A,C3x
x
x4f
resultSpan.innerText ="Hello "+ message;ITPUB个人空间t0u9T
[RyTZ
}
*_M@'J1t\\0</script>
再编写一个简单的输入信息界面:
<StackPanelBackground="#CDFCAE"Orientation="Vertical">
3F-W7M^$p]H2G E0<StackPanelHeight="40">
(Asj}-X"]0c m0<TextBlockText="Calling Browser Script. from Silverlight"
(IP9P
XX-pZ4S0Foreground="Red"></TextBlock>
;SJY,[{D R6p6i0</StackPanel>ITPUB个人空间DFv)?%W'jl
<StackPanelOrientation="Horizontal">
%\B'vEW0<TextBoxx:Name="input"Width="340"Height="40"Margin="20 0 20 0"></TextBox>
(l Q&Rb nsC*b!_2J
{n0<Buttonx:Name="submit"Width="120"Height="40"Background="Red"ITPUB个人空间R~KM3E:My
Content="调 用"FontSize="20"Foreground="Red"Click="submit_Click"></Button>
RAV_ntvF9To9t0</StackPanel>
vi~:NDM$Tg8V0</StackPanel>
实现对脚本的调用:
private voidsubmit_Click(objectsender,RoutedEventArgse)ITPUB个人空间
~VyOZ/\a3_u
{
'v1KFgQ&L0ScriptObjecthello =HtmlPage.Window.GetProperty("Hello")asScriptObject;ITPUB个人空间*]*h/y6BB w{'I_E
hello.InvokeSelf(this.input.Text);ITPUB个人空间4}n^!R/~
O
}
ScriptObject提供了任何客户端脚
本的封装,不仅仅是JavaScript,使用其他的AJAX框架也可以,如jQuery等。然后调用InvokeSelf()方法,传入参数,这里
ScriptObject总共提供了两个方法,Invoke和InvokeSelf,如果我们只调用脚本对象的自身,就可以使用InvokeSelf,如
果脚本对象中还有其它的函数等,可以使用Invoke传入名称进行调用,两个方法的定义如下:
[SecuritySafeCritical]ITPUB个人空间Z|.vL%Xg)r[ ~m
public virtual objectInvoke(stringname,params object[] args);
T#{8FW@8P0ITPUB个人空间.U`Z8^'\o
[SecuritySafeCritical]
nh,LIF0public virtual objectInvokeSelf(params object[] args);
运行上面的示例:
\au bb`4b,N
q0
1_7hb V;I2wl"j5@-P0输入TerryLee后点击调用,可以看到确实调用了客户端脚本:
@3Yy1f3@e#i%^0
_9d2LBk,is&I9BK(|0
输入TerryLee后点击调用,可以看到确实调用了客户端脚本:
pn I3D6C3W6K3x/};X0
qR5@5N\hl!iKD8u M0使用CreateInstance创建脚本对象
除了使用上面所说的使用HtmlPage.Window.GetProperty方法获取脚本对象之外,还有一种替代方法,即使用
HtmlPage.Window属性的CreateInstance方法。还是使用上面的示例,我们在测试页中加入如下一段脚本,使用prototype
为myHello添加了显示的功能:
<script.type="text/javascript">
x!KY6_ lQ!~uu0myHello =function(message)ITPUB个人空间{9f$xqO PS3N
{
HlE@Da)c0this.Message = message;
4H&P]v-Hr7L+fS)D0}
8{1` Y*`vT7['v1U#A0myHello.prototype.Display =function()ITPUB个人空间2Af.RaIf
{
gs.kJw9c!]0varresultSpan = $get("result");
1p\9BV8Ff4wd0resultSpan.innerText ="Hello "+this.Message;
;W(M P:M+ZT']un0}ITPUB个人空间%},c^ T^B
U%q%H*@
</script>
使用HtmlPage.Window.CreateInstance创建脚本对象
private voidsubmit_Click(objectsender,RoutedEventArgse)
1v4t#u)mVT
dBU o0{
Q#gZTA#t!~0ScriptObjectscript. =HtmlPage.Window.CreateInstance("myHello",this.input.Text);ITPUB个人空间gfIi:oR?!J']0k
ITPUB个人空间 w9SA&fSV2P+N
objectresult = script.Invoke("Display");
i"bb$qb0}
运行后的效果跟上面的示例是一样的,如:
R&C:nP8Y9e\0
0k'd!o
l&i0输入文本信息后:ITPUB个人空间v&oq6HL?-E#A

/E's,Wr
r_xg)tn0
使用HtmlPage.Window.Eval()
最后还有一种机制,就是使用HtmlPage.Window.Eval()方法,只要我们给该方法传入一段字符串,它都会作为JavaScript来执行。做一个简单的测试,我们再修改一下上面的示例代码:
private voidsubmit_Click(objectsender,RoutedEventArgse)ITPUB个人空间LI1K
I*Z_5~
{
c-Ik]}k.IP0HtmlPage.Window.Eval(this.input.Text);ITPUB个人空间,`z?x:AZ']b-v[;v
}
运行后我们在文本框中输入一段脚本alert('TerryLee');,效果如下所示:

既然HtmlPage.Window.Eval()可以执行一段脚本,并且将执行的结果以对象形式返回,我们可以使用它来获取DOM元素。如下面这段代码:
private voidsubmit_Click(objectsender,RoutedEventArgse)
*X)G'^c:n6R"g"c0{
Gf
Go @T-G0S6C1H4F?0HtmlElementresult =HtmlPage.Window.Eval("document.getElementById('result')")asHtmlElement;
7m1x[2{g
X\0
C7Ny&ww#I0stringmessage = result.GetAttribute("innerHTML");ITPUB个人空间%ofUqUM$f
HtmlPage.Window.Alert(message);ITPUB个人空间"ZH#Ud
HCv$U
}
运行后效果如下,获取的result确实就是我们定义的div。ITPUB个人空间#EloN&nT%}r

C? \J8BB/L8D0
对AJAX框架的支持
前面说过,ScriptObject不仅仅是对JavaScript的封装,也支持其它的AJAX框架,现在我们用jQuery来测试一下,编写一小段代码:
<script.type="text/javascript">ITPUB个人空间6qYc,mC@R
functionmyHello(message)
'Mr3c Bw!?b.w0{
v/AJ)zn`-G0$("#result").text("Hello "+ message);ITPUB个人空间q2`xV
z2EUZ1cXm
}ITPUB个人空间-|Pr3`y} J~E`
</script>
调用脚本
private voidsubmit_Click(objectsender,RoutedEventArgse)
0G"kPq#X Jx s0{
R3QsO5T-ofVi^0ScriptObjectscript. =HtmlPage.Window.GetProperty("myHello")asScriptObject;
d!A/id(y
HZc}/U,N0ITPUB个人空间:dt1Z0[!o#R
script.InvokeSelf(this.input.Text);
dj_N}0}
运行后的结果与前面的示例是一样的:ITPUB个人空间"d-^lf6|0\u5d_

+G;t-|xOz |0
结束语
本文介绍了在Silverlight中调用JavaScript的几种方法,下一篇我将介绍如何在JavaScript中调用Silverlight。
ITPUB个人空间_.VX#wLnv