[Silverlight探秘]利用Javascript调用silverlight的方法

 

********************************************************************
*                                                 版权声明
*
* 本文以Creative Commons的发布,请严格遵循该授权协议。
* 本文首发于博客园, 此声明为本文章中不可或缺的一部分。
* 作者网名：    浪子
* 作者EMAIL：dayichen (at)163.com
* 作者BLOG：  Http://Www.Cnblogs.Com/Walkingboy
*
********************************************************************

[Silverlight探秘]利用Javascript调用silverlight的方法

－Written by 浪子@cnblogs.com  (07-06-19)

摘要：

在引入sl的时候，我最关心的是，如何和现有的很多成熟代码结合？或者说如何在两者之间进行交互。

本文从js如何调用silverlight的方法入手，接下来再学习如何从silverlight调用js方法，慢慢深入学习它们两者之间的交互知识

本文环境：

• Codename Orcas Beta1
• Silverlight 1.1 Alpha
• IE 6.0

创建Silverlight工程：

编写Silverlight的托管方法：

当然silverligh可以使用多种托管语言，我这里使用c＃。

   public partial class Page : Canvas
{
public void Page_Loaded(object o, EventArgs e)
{
// Required to initialize variables
InitializeComponent();
}
public string SayHello(string name)
{
return "hello," + name;
}
}

这里我们只在原来的基础上定义了一个public 的方法SayHello，返回一string

要让客户端可以访问到这个方法，需要做以下工作：

1、引入System.Windows.Browser;

using System.Windows.Browser;

 

2、为类和方法贴上标签

   [Scriptable]
public partial class Page : Canvas
{
public void Page_Loaded(object o, EventArgs e)
{
// Required to initialize variables
InitializeComponent();
}
[Scriptable]
public string SayHello(string name)
{
return "hello," + name;
}
}

3、在Canvas创建的时候，为这个类注册一个客户端访问实例

public Page()
{
WebApplication.Current.RegisterScriptableObject("LangZi", this);
}

 

最终代码如下：

     [Scriptable]
    public partial class Page : Canvas
    {
        public Page()
        {
            WebApplication.Current.RegisterScriptableObject("LangZi", this);
        }

        public void Page_Loaded(object o, EventArgs e)
        {
            // Required to initialize variables
            InitializeComponent();
        }

        [Scriptable]
        public string SayHello(string name)
        {
            return "hello," + name;
        }
    }

使用Javascript调用SayHello:

     1、获取Canvas的实例引用

var control = document.getElementById("SilverlightControl");

获取Canvas的dom容器元素。
2、获取Page的实例引用 ，注意刚才我们注册的实例名称”LangZi“

var manage = control.Content.LangZi;

3、调用方法SayHello:

alert(manage.SayHello(name));

有了这种沟通方式，以前很多在javascript里运算的函数，可能就可以放到托管代码里进行运算，可能会提高很大的效率哦。

不过这个返回值不知道支持到何种程度（返回自定义类是否被转换为json格式？），还有待进一步测试。

本文的测试代码：JavascriptCallSilverlight.rar