现在的位置: 首页 > 综合 > 正文

Silverlight 2 教程(五):JavaScript与Silverlight托管代码相互调用

2012年05月06日 ⁄ 综合 ⁄ 共 4322字 ⁄ 字号 评论关闭

要实现JavaScript调用Silverlight程序里面的托管代码,需要先在应用程序的启动(Application_Startup)事件里注册要进行访问的对象,而要从Silverlight的托管代码里访问HTML页面对象或者页面中的JavaScript,使用HtmlPageDocument/HtmlElementHtmlWindow即可。

下面,我们就以例子来说明两者相互访问的方法,代码里面有很详细的注释,这里不再累述。


Page.xaml

<UserControl x:Class="SilverlightApplication1.Page"
    xmlns
="http://schemas.microsoft.com/client/2007" 
    xmlns:x
="http://schemas.microsoft.com/winfx/2006/xaml" 
    Width
="400" Height="300">
    
<Grid x:Name="LayoutRoot" Background="White">
        
<Canvas Canvas.Top="20">
            
<TextBlock Canvas.Top="10" Canvas.Left="20">请输入您的姓名: </TextBlock>
            
<TextBox x:Name="UserInput" Width="200" Height="30" Canvas.Top="40" Canvas.Left="20"></TextBox>
            
<TextBlock x:Name="Msg" Canvas.Top="90" Canvas.Left="20" Foreground="Navy" FontSize="36"></TextBlock>
            
<Button Click="Button_Click" Content="单击我" FontSize="24" Width="160" Height="60" x:Name="BtnTest" Canvas.Top="160" Canvas.Left="20"></Button>
        
</Canvas>
    
</Grid>
</UserControl>

Page.xaml.cs

using System;
using System.Collections.Generic;
using System.Linq;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Animation;
using System.Windows.Shapes;
using System.Windows.Browser;

namespace SilverlightApplication1
{
    
public partial class Page : UserControl
    {
        
public Page()
        {
            InitializeComponent();
        }

        private void Button_Click(object sender, RoutedEventArgs e)
        {
            
string UserInputContent = this.UserInput.Text;
            
if (UserInputContent.Equals(String.Empty))
            {
                UserInputContent = "Hello Silverlight World!";
            }
            
else
            {
                UserInputContent = "
你好," + UserInputContent;
            }
            HtmlWindow win = HtmlPage.Window;
            
this.Msg.Text = UserInputContent;
            win.Alert("Silverlight 
里面弹出的对话框。 " + UserInputContent);
            
//执行页面中的js函数:
            win.Eval("getArrayTest()");
            Object[] args = { "
将此参数传递给 js 函数" };
            win.Invoke("getArrayTest", args);
            
//如果页面中的值
            HtmlDocument doc = HtmlPage.Document;
            doc.GetElementById("UserName").SetAttribute("value", 
this.UserInput.Text);
        }

        [ScriptableMember()]
        public string InterInvole()
        {
            
string username = HtmlPage.Document.GetElementById("UserName").GetAttribute("value");
            
this.UserInput.Text = username;
            
this.Msg.Text = "您输入了:" + username; 
            
return "你从js脚本中调用了 Silverlight 里面的方法。";
        }
    }
}


App.xaml.cs

using System;
using System.Collections.Generic;
using System.Linq;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Animation;
using System.Windows.Shapes;
using System.Windows.Browser;

namespace SilverlightApplication1
{
    
public partial class App : Application
    {

        public App()
        {
            
this.Startup += this.Application_Startup;
            
this.Exit += this.Application_Exit;
            
this.UnhandledException += this.Application_UnhandledException;

            InitializeComponent();
        }

        private void Application_Startup(object sender, StartupEventArgs e)
        {
            
// Load the main control           
            Page p = new Page();
            HtmlPage.RegisterScriptableObject("SilverlightApplicationExample", p);

            // 请注意这里的定义方法,如果这里的p写成 new Page(),则Javascript基本不能给 UserInput 赋值!
            this.RootVisual = p;
        }

        private void Application_Exit(object sender, EventArgs e)
        {

        }
        private void Application_UnhandledException(object sender, ApplicationUnhandledExceptionEventArgs e)
        {

        }
    }
}

SilverlightApplication1TestPage.aspx

<%@ Page Language="C#" AutoEventWireup="true" %>

<%@ Register Assembly="System.Web.Silverlight" Namespace="System.Web.UI.SilverlightControls" TagPrefix="asp" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
 
<title>Silverlight 2托管代码与Javascript交互的例子</title>
 
<script type="text/javascript">
 
//<!{CDATA[
 //

抱歉!评论已关闭.