Wiki


Wiki Table of Contents

Tags

Page Details

Published by:
1 person found this article useful.

100% of people found this useful
Silverlight Tip of the Day #15 – Communicating between JavaScript & Silverlight

 

Rất may mắn là sự giap tiếp giữa Silverlight và Javascript  tương đối không phức tạp cho lắm. Ví dụ dưới đây sẽ minh chứng cho bạn biết phải làm như thế nào để sử dụng 2 cách gọi.

Gọi Silverlight Từ Java script:

  1. Trong hàm khởi tạo của Silverlight app, thực hiện gọi đến RegisterScriptableObject (). Bản chất của phương thức gọi này là đăng kí một đối tượng quản lý cho kịch bản kết nối (scriptable access) bởi mã Javascript.. Tham số đầu tiên có thể tùy ý đặt từ khóa theo ý của bạn. Từ khóa này sẽ tham chiếu đến mã  Javascript của bạn khi thực hiện phương thức gọi Silverlight.
  2. Thêm fuction mà bạn muốn gọi trong code Silverlight của bạn. Bạn nên thêm nó với thuộc tính  [ScriptableMember] ở đầu.
  3. Trong Javascript, bạn có thể gọi trực tiếp đến function nằm trong code Silverlight của bạn . Điều này có thể thực hiện được bởi document object. Từ thí dụ của tôi sau đây: document.getElementById("silverlightControl").Content.Page.UpdateText("Hello from Javascript!"); nơi  “silverlightControl” là  ID của Silverlight control của tôi.

Gọi Javascript Từ Silverlight:

  1. Javascript có thể được gọi trực tiếp trong function  HtmlPage.Window.Invoke() .

Thí dụ cho cả hai cách trên:

Page.xaml:

namespace SilverlightApplication
{
    public partial class Page : UserControl
    {
        public Page()
        {
            InitializeComponent();
 
            HtmlPage.RegisterScriptableObject("Page", this);            
            HtmlPage.Window.Invoke("TalkToJavaScript", "Hello from Silverlight");
        }
 
        [ScriptableMember]
        public void UpdateText(string result)
        {
            myTextbox.Text = result;
        }
    }
} 

Default.aspx:

<script type="text/javascript"> 
        function TalkToJavaScript( data)
        {
            alert("Message received from Silverlight: "+data);
            
            var control = document.getElementById("silverlightControl");            
            control.Content.Page.UpdateText("Hello from Javascript!");
        }    
</script>

Page.xaml:

<UserControl x:Class="SilverlightApplication7.Page"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
    Width="400" Height="300">
    <Grid x:Name="LayoutRoot" Background="White">
        <TextBlock x:Name="myTextbox">Waiting for call...</TextBlock>
    </Grid>
</UserControl>

Thank you,
--Mike Snow

Recent Comments

Leave the first comment for this page.