(21): How does Silverlight 2 call Javascript in Silverlight?

Summary The release of Silverlight 2 beta 1 brings us a lot of surprises from runtime and tools, such as supporting the framework languages Visual Basic, Visual C #, ironruby, ironpython, A series of new features such as JSON, Web Service, WCF, and sockets support. The article "one-step learning Silverlight 2 series" takes you to Silverlight 2 development quickly from the following aspects: Silverlight 2 basic knowledge, data and communication, custom controls, animation, and graphic images. Silverlight provides built-in support for HTML and client scripts. In many cases, some JavaScript or Ajax frameworks are used in our web applications. We hope to call some script methods in Silverlight or trigger the execution of a script in Silverlight, in this case, JavaScript needs to be called in Silverlight. This article will briefly introduce this content. Use getproperty to obtain the script object. Let's take a look at a simple example. Put a DIV in the Silverlight test page for display information:

<div id="result"></div>

Write a simple JavaScript code:

<script type="text/javascript">    function Hello(message)    {        var resultSpan = $get("result");        resultSpan.innerText = "Hello " + message;    }</script>

Write a simple input interface:

<Stackpanel background = "# cdfcae" orientation = "vertical"> <stackpanel Height = "40"> <textblock text = "calling browser script from Silverlight" foreground = "red"> </textblock> </stackpanel> <stackpanel orientation = "horizontal"> <textbox X: name = "input" width = "340" Height = "40" margin = "20 0 20 0"> </textbox> <button X: name = "Submit" width = "120" Height = "40" background = "red" content = "call" fontsize = "20" foreground = "red" Click = "submit_click "> </button> </stackpanel>

To call the script:

private void submit_Click(object sender, RoutedEventArgs e){    ScriptObject hello = HtmlPage.Window.GetProperty("Hello") as ScriptObject;    hello.InvokeSelf(this.input.Text);}

Scriptobject provides encapsulation of any client script, not just JavaScript, but also other Ajax frameworks, such as jquery. Then call the invokeself () method and pass in the parameters. Here, scriptobject provides two methods in total: invoke and invokeself. If we only call the script object itself, we can use invokeself, if there are other functions in the script object, you can use the invoke input name to call them. The two methods are defined as follows:

[SecuritySafeCritical]public virtual object Invoke(string name, params object[] args);[SecuritySafeCritical]public virtual object InvokeSelf(params object[] args);

Run the preceding example: Enter terrylee and click "call". You can see that the client script is indeed called: Using createinstance to create a script object, in addition to using htmlpage. window. in addition to the getproperty method to get the script object, there is also an alternative method, that is, using htmlpage. the createinstance method of the window attribute. In the preceding example, we add the following script to the test page and use prototype to add the display function for myhello:

<script type="text/javascript">    myHello = function(message)    {        this.Message = message;    }    myHello.prototype.Display = function()    {        var resultSpan = $get("result");        resultSpan.innerText = "Hello " + this.Message;    }</script>

Use htmlpage. Window. createinstance to create a script object

private void submit_Click(object sender, RoutedEventArgs e){    ScriptObject script = HtmlPage.Window.CreateInstance("myHello",this.input.Text);    object result = script.Invoke("Display");}

The effect after running is the same as in the preceding example. For example, after entering text information: Use htmlpage. window. the last mechanism of eval () is to use htmlpage. window. eval () method, as long as we pass in a string for this method, it will be executed as JavaScript. For a simple test, let's modify the sample code above:

private void submit_Click(object sender, RoutedEventArgs e){    HtmlPage.Window.Eval(this.input.Text);}

After running, input a script alert ('terrylile') in the text box. The effect is as follows. window. eval () can execute a script and return the execution result as an object. We can use it to obtain DOM elements. See the following code:

private void submit_Click(object sender, RoutedEventArgs e){    HtmlElement result = HtmlPage.Window.Eval("document.getElementById('result')") as HtmlElement;    string message = result.GetAttribute("innerHTML");    HtmlPage.Window.Alert(message);}

The effect after running is as follows. The result obtained is indeed the DIV defined by us. Support for the Ajax framework as mentioned earlier, scriptobject not only encapsulates JavaScript, but also supports other Ajax frameworks. Now let's test it with jquery and write a short piece of code:

<script type="text/javascript">    function myHello(message)    {        $("#result").text("Hello " + message);    }</script>

Call scripts

private void submit_Click(object sender, RoutedEventArgs e){    ScriptObject script = HtmlPage.Window.GetProperty("myHello") as ScriptObject;    script.InvokeSelf(this.input.Text);}

The running result is the same as the previous example: Conclusion This article describes several methods to call Javascript in Silverlight. Next I will introduce how to call Silverlight in JavaScript.

This article is from the "terrylee technology column" blog, please be sure to keep this source http://terrylee.blog.51cto.com/342737/67264

This article is from 51cto. com technical blog