前言:Silverlight 2.0 Beta1 已经发布,加入了许多激动人心的新特性:WPF UI 框架、丰富的控件、丰富的网络支持、丰富的基础类库支持等。这是本人的学习笔记,写的比较乱,因此定名为乱弹琴 Silverlight 2.0 系列文章。
本篇介绍Silverlight调用Javascript。
与调用Script(包括Javascript)相关的类型:
System.Object
System.Windows.Browser.ScriptObject
System.Windows.Browser.HtmlObject
System.Windows.Browser.HtmlDocument
System.Windows.Browser.HtmlElement
System.Windows.Browser.HtmlWindow
等等,HtmlWindow实现地最完善,主要介绍HtmlWindow。
文档中ScriptObject和HtmlObject的继承关系描述并不一致,用Reflector反射可以看出HtmlObject继承自ScriptObject。
说明部分文档有错误。
ScriptObject作为HtmlWindow、HtmlElement等第二父类出现的,则HtmlWindow、HtmlElement等可以调用父类的公共方法和保护方法。操作Javascript就方便多了。
用SL创建Javascript代码段
C#:
HtmlElement heScript = HtmlPage.Document.CreateElement("script");
heScript.SetAttribute("type", "text/javascript");
heScript.SetProperty("text", "function sayHello(){alert('Hello World!');}");
HtmlPage.Document.Body.AppendChild(heScript);
调用Javascript函数
可以调用浏览器内置的函数,也可以调用自定义的函数。
示例:(调用上面定义的代码段的函数)
XAML:
<
Grid
Background
="DarkGreen"
ShowGridLines
="True"
>
<
Button
x:Name
="sayHello"
Content
="Hello World!"
Click
="sayHello_Click"
></
Button
>
</
Grid
>
C#:
private
void
sayHello_Click(
object
sender, RoutedEventArgs e)
{
ScriptObject so
=
HtmlPage.Window.GetProperty(
"
sayHello
"
)
as
ScriptObject;
so.InvokeSelf();
}
运行效果:
InvokeSelf方法定义为:
public
virtual
Object InvokeSelf(
//
调用ScriptObject实例自身
params
Object[] args
//
为Javascript函数的参数
)
也可以用直接用 HtmlPage.Window.Invoke("sayHello");
Invoke方法定义为:
Invoke方法定义为:
public
virtual
Object Invoke(
string
name,
//
要调用的Javascript的函数名
params
Object[] args
//
为Javascript函数的参数
)
HtmlWindow的Eval()方法
Javascript的Eval()函数有时候非常好用,这里HtmlWindow的Eval()方法也具有将字符串转化为可执行代码的功能。
示例:
XAML:
<
StackPanel
Background
="DarkGreen"
>
<
TextBox
x:Name
="txtScript"
Width
="400"
Margin
="0,30,0,30"
></
TextBox
>
<
Button
x:Name
="btnEval"
Content
="Test Eval()"
Width
="100"
Click
="btnEval_Click"
></
Button
>
</
StackPanel
>
C#:
private
void
btnEval_Click(
object
sender, RoutedEventArgs e)
{
HtmlPage.Window.Eval(txtScript.Text);
}
运行效果:
HtmlWindow的Alert()、Confirm()、Prompt()方法
以上三个方法都是包装的浏览器Javascript函数,如HtmlWindow.Confirm()方法源码为:
public
bool
Confirm(
string
confirmText)
{
HtmlPage.VerifyThread();
if
(confirmText
==
null
)
{
confirmText
=
string
.Empty;
}
return
(
bool
)
this
.Invoke(
"
confirm
"
,
new
object
[] { confirmText });
}
示例:
XAML:
<
Grid
Background
="DarkGreen"
>
<
Button
x:Name
="btnTest"
Content
="Test Alert、Confirm、Prompt"
Click
="btnTest_Click"
></
Button
>
</
Grid
>
C#:
private
void
btnTest_Click(
object
sender, RoutedEventArgs e)
{
var str
=
HtmlPage.Window.Prompt(
"
Please in put your blog:
"
);
var confirm
=
HtmlPage.Window.Confirm(
"
Your blog is:\"
"
+
str
+
"
\",are you sure?
"
);
if
(confirm)
{
HtmlPage.Window.Alert(
"
OK! Your blog is:\"
"
+
str
+
"
\"
"
);
}
else
{
HtmlPage.Window.Alert(
"
I'm sorry, you input a wrong blog!
"
);
}
}
运行效果:
HtmlWindow的CreateInstance()方法
其作用是创建Javascript对象的实例。
示例:
Javascript:
<script type="text/javascript">
var Hello = function(yourName)
{
this.YourName = yourName;
}
Hello.prototype.Alert = function()
{
alert("Hello " + this.YourName);
}
</script>
XAML:
<StackPanel Background="DarkGreen">
<TextBox x:Name="txtYourName" Width="400" Margin="0,30,0,30"></TextBox>
<Button x:Name="btnTest" Content="Test CreateInstance"
Width="200" Click="btnTest_Click"></Button>
</StackPanel>
C#:
private void btnTest_Click(object sender, RoutedEventArgs e)
{
ScriptObject so = HtmlPage.Window.CreateInstance("Hello", txtYourName.Text);
so.Invoke("Alert");
}
运行效果:
HtmlWindow的Navigate()、NavigateToBookmark()方法
这两个(Navigate()有三个重载方法)方法内部实现都是调用的浏览器内置的Javascript函数(open())或属性(location),作用是导航到其它链接或打开新窗口及导航到书签,使用方法不多介绍。
结束语:
Silverlight 提供了强大的互操作接口,可以实现丰富多样的交互,大大方便了网页设计开发人员。