Silverlight 4 WebBrowser的使用及调用 WebBrowser 中的 javascript 方法

The following example shows how to handle the ScriptNotify event. In this example, the InvokeScript is called, which in turn calls the LoadSearch function in the following HTML.

The HTML file must be hosted in the same domain as the Silverlight application. The Javascript within the HTML page calls window.external.notify,

 which raises the ScriptNotify event in the Silverlight application

必须在同一个域下才可用哦！

example：

InvokeScript is called, which in turn calls the LoadSearch function in the following HTML. The HTML file must be hosted in the same domain as the Silverlight application. The Javascript within the HTML page calls window.external.notify, which raises the ScriptNotify event in the Silverlight application.

Silverlight 4 WebBrowser的使用及调用 WebBrowser 中的 javascript 方法

<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
<title></title>
<script type="text/javascript" >
function LoadSearch(searchString) {
window.location = "http://www.bing.com/search?q=" + searchString
window.external.notify("Search completed")
}
</script>
</head>
<body>
Silverlight WebBrowser control.
</body>
</html>

public partial class MainPage : UserControl
{
public MainPage()
    {
        InitializeComponent();
    }

void WB1_ScriptNotify(object sender, NotifyEventArgs e)
    {
        Button1.Content = e.Value;
        Button1.IsEnabled = false;

    }

private void Button1_Click(object sender, RoutedEventArgs e)
    {
object results = WB1.InvokeScript("LoadSearch", new string[] { "Silverlight" });
    }
}

?

<div class="likecs_code"><pre><div>XAML <StackPanel x:Name="LayoutRoot" Height="358" Width="489" Background="LightBlue"> <WebBrowser x:Name="WB1" Source="http://localhost/HTMLPage1.htm" Height="272" Width="379" ScriptNotify="WB1_ScriptNotify" Margin="5" /> <Button Width="200" x:Name="Button1" Content="Click to search!" Click="Button1_Click" /> </StackPanel></div></pre>

</div>

 

详细实例请看下文（是一个外国家伙写的,很简单一看就懂的，不翻译了）：

Until version 4, Silverlight does not really have a mechanism for displaying HTML based content.

Prior to version 4, you can have Silverlight controls and HTML UI co-existing in the browser and they can interoperate with each other in a rich way. You can even use transparency and windowless techniques to overlay them but you can’t really ask a Silverlight application to display HTML for you. You always have to get it done elsewhere and, furthermore, if you then packaged your application to run as a Silverlight Out-Of-Browser (SLOOB) app then those techniques wouldn’t help as you lose the ability to display HTML at all.

That changes with version 4 with the new WebBrowser control ( WPF also has a Frame and a WebBrowser control which both offer levels of HTML hosting ability – the Silverlight WebBrowser looks like a subset of the WPF version ).

The first thing to say about the WebBrowser control is that it only functions in Silverlight Out-Of-Browser applications ( SLOOBs ) – in the browser the control displays a blank UI so an application developer/designer would need to think about how that would work if the application can also be run within a browser window.

For an out-of-browser application, I can put a simple UI together;

<UserControl x:Class="SilverlightApplication16.MainPage" 
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
    mc:Ignorable="d" 
    d:DesignHeight="300" d:DesignWidth="400">

<Grid x:Name="LayoutRoot" Background="White"> 
<Grid.RowDefinitions> 
<RowDefinition Height="Auto"/> 
<RowDefinition /> 
</Grid.RowDefinitions> 
<Grid 
            x:Name="gridControls"> 
<Grid.ColumnDefinitions> 
<ColumnDefinition /> 
<ColumnDefinition 
                    Width="Auto" /> 
</Grid.ColumnDefinitions> 
<TextBox 
                x:Name="txtUri" 
                Margin="5" 
                HorizontalAlignment="Stretch" /> 
<Button 
                x:Name="buttonGo" 
                Grid.Column="1" 
                Content="Go" 
                Click="OnGo" 
                Margin="5" /> 
</Grid> 
<WebBrowser 
            LoadCompleted="BrowserLoadCompleted" 
            Grid.Row="1" 
            Margin="5" 
            x:Name="browserControl" /> 
</Grid> 
</UserControl>

and then add a little code-behind that;

view plain copy to clipboard print ?

using System;  
using System.Collections.Generic;  
using System.Linq;  
using System.Net;  
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;  

namespace SilverlightApplication16  
{  
public partial class MainPage : UserControl  
  {  
public MainPage()  
    {  
      InitializeComponent();  
    }  
private void OnGo(object sender, RoutedEventArgs e)  
    {  
      buttonGo.IsEnabled = false;  

      browserControl.Navigate(new Uri(txtUri.Text, UriKind.Absolute));  
    }  
private void BrowserLoadCompleted(object sender, EventArgs e)  
    {  
      buttonGo.IsEnabled = true;  
    }  
  }  
}