Silverlight 访问Javascript对象

在Silverlight中对Javascript的操作,主要用到System.Windows.Browser.HtmlPage.Window中提供的相关方法。

在HTML页面中有如下Javascript代码:

<script type="text/javascript">
    function GetBP(id) {
        //根据id通过ajax获取数据,省略。
        var bp = { "BH": "0102007009", "Name": "Ⅱ-7高边坡", "X": 118.2039630, "Y": 30.0837440 };
        return bp;
    }
</script>

Silverlight中,通过System.Windows.Browser.HtmlPage.Window.Eval(string code)方法可以执行Javascript代码并获取其返回值(object),将返回值转换为System.Windows.Browser.ScriptObject,再通过GetProperty即可获得相应的值:

object obj = System.Windows.Browser.HtmlPage.Window.Eval(string.Format("GetBP('{0}');", id));
string ret = string.Format("编号:{0}n名称:{1}n经度:{2}n纬度:{3}",
    ((System.Windows.Browser.ScriptObject)obj).GetProperty("BH"),
    ((System.Windows.Browser.ScriptObject)obj).GetProperty("Name"),
    ((System.Windows.Browser.ScriptObject)obj).GetProperty("X"),
    ((System.Windows.Browser.ScriptObject)obj).GetProperty("Y"));
System.Windows.Browser.HtmlPage.Window.Alert(ret);

结果如下图所示:

如果Javascript代码返回的是简单的对象(字符串、数字等),则直接ToString()即可,如下:

object obj = System.Windows.Browser.HtmlPage.Window.Eval(string.Format("GetBP('{0}').Name;", id));
string Name = obj.ToString();
System.Windows.Browser.HtmlPage.Window.Alert("名称:" + Name);

 

 

 

在 JavaScript 语法中使用了 silverlightObject 占位符。您可以通过对大多数 Silverlight 对象调用 GetHost 从 JavaScript API 中获取对 silverlightObject 对象的引用。此外,您还可以调用 Document.GetElementByID 并指定实例化 Silverlight 插件的 object 元素的 ID,从而从 DOM 中获取 silverlightObject 实例。

Silverlight.js 语法基于 Silverlight.js 函数,截至本文档发布之日,这些函数是最新的。Silverlight.js 库可能已由 Microsoft 更新。在这种情况下,语法可能会发生更改,包括参数名称和参数顺序。

Silverlight 调用 javaScript
主要使用 HtmlPage.Window 这个对象

xaml.cs 

private void button1_Click(object sender, RoutedEventArgs e)
        {
            //使用Invoke
            HtmlPage.Window.Invoke("calljs", "Invoke");
        }

 

        private void button2_Click(object sender, RoutedEventArgs e)
        {
            //创建脚本对象
            ScriptObject calljs =
                (ScriptObject)HtmlPage.Window.GetProperty("calljs");
            //使用InvokeSelf
            calljs.InvokeSelf("InvokeSelf");
        }

 

        private void LayoutRoot_Loaded(object sender, RoutedEventArgs e)
        {
            //JavaScript脚本
            string jsText = @"function calljs(msg){
                        alert(msg);
                    }";
            //创建脚本片段
            HtmlElement element = HtmlPage.Document.CreateElement("Script");
            element.SetAttribute("type", "text/javascript");
            element.SetProperty("text", jsText);
            //添加脚本到Html页面中
            HtmlPage.Document.Body.AppendChild(element);
        }

 

 

声明创建javaScript  对象的调用方式

private void LayoutRoot_Loaded(object sender, RoutedEventArgs e)
        {
            //JavaScript脚本
            string jsText = @"
                jsObject = function(msg)
                {
                    this.Msg = msg;
                }
                jsObject.prototype.Show = function()
                {
                    alert(this.Msg);
                }";

 

           //创建脚本对象
            HtmlElement element =  HtmlPage.Document.CreateElement("Script");
            element.SetAttribute("type", "text/javascript");
            element.SetProperty("text", jsText);
            //添加JavaScript到Html页面
            HtmlPage.Document.Body.AppendChild(element);
        }

 

        private void button1_Click(object sender, RoutedEventArgs e)
        {
            //使用CreateInstance获取JavaScript对象
            ScriptObject script =  HtmlPage.Window.CreateInstance("jsObject" , textBox1.Text);
            script.Invoke("Show");
        }

 

使用 HtmlWindow 的 Eval 方法

直接写入javascript 的文本,通过

HtmlPage.Window.Eval(textBox1.Text);来运行这个命令,比如textBox1.Text = “alert('欢迎!')”

 

javaScript 调用  Silverlight
  在xaml.cs 中先要初始化定义好可以被访问的对象和方法

 

      public javascript5()
        {
            InitializeComponent();
            //注册JavaScript的访问对象
            HtmlPage.RegisterScriptableObject("Builder", this);
        }

 

        //定义CreateRect为脚本成员
        [ScriptableMember]
        public void CreateRect(int width, int height)
        {
            //创建一个矩形对象
            Rectangle rect = new Rectangle();
            rect.Width = width;
            rect.Height = height;
            rect.Fill = new SolidColorBrush(Colors.Blue);
            LayoutRoot.Children.Clear();
            LayoutRoot.Children.Add(rect);
        }

 

然后在js的部分就可以调用了

<script type="text/javascript">
        function createRectangle() {
            //根据object的id来获取Silverlight对象
            var xamlobj = document.all('XamlObject');
            //调用Silverlight中的CreateRect方法
            xamlobj.content.Builder.CreateRect(
            document.all('txtWidth').value
            ,document.all('txtHeight').value);
        }
    </script>

 

以上是小编为您精心准备的的内容,在的博客、问答、公众号、人物、课程等栏目也有的相关内容,欢迎继续使用右上角搜索按钮进行搜索javascript
, windows
, string
, 对象
, silverlight
window
javascript 对象访问、silverlight跨域访问、javascript 对象、javascript 面向对象、javascript map对象,以便于您获取更多的相关知识。

时间: 2024-09-21 07:49:13

Silverlight 访问Javascript对象的相关文章

JavaScript中子对象访问父对象的方式详解_javascript技巧

在传统面向对象的编程语言里,都会提供一种子类访问父类的特殊语法,引文我们在实现子类方法往往需要父类方法的额外辅助.在这种情况下,子类通常会调用父类中的同名方法,最终以便完成工作. javascript虽然没有类似上述的特殊语法,但我们可以造一个啊! function her(){}; her.prototype.name = 'Anna'; her.prototype.toString = function(){ var const = this.constructor; return cons

JavaScript中访问节点对象的方法有哪些如何使用_javascript技巧

JavaScript中访问节点对象的方法有哪些? 复制代码 代码如下: var obj = document.getElementById('fdafda'); var obj = document.f1; obj.method="post"; obj.action='Bb'; var obj = document.f1.userName; var obj = document.forms[0].userName; var obj = document.forms[0].element

JavaScript对象属性检查、增加、删除、访问操作实例_javascript技巧

检查属性 var mouse = { "name": "betta", "age": 3, "varieties": "milaoshu" } mouse.hasOwnProperty("name"); // true mouse.hasOwnProperty("sex"); //false 增加属性 定义个对象 dog,然后赋予各种特性,再赋予 color特性,最后

javascript 面向对象-JavaScript对象多个属性的访问问题:

问题描述 JavaScript对象多个属性的访问问题: 代码如下 , 问题,为啥_year属性没有改变呢? var book = {}; Object.defineProperties(book , { _year: { value: 2004 }, edition: { value: 1 }, year: { get: function(){ return this._year; }, set: function(newValue){ // alert(newValue); if(newVal

JavaScript中访问节点对象的方法有哪些?

JavaScript中访问节点对象的方法有哪些? var obj = document.getElementById('fdafda'); var obj = document.f1; obj.method="post"; obj.action='Bb'; var obj = document.f1.userName; var obj = document.forms[0].userName; var obj = document.forms[0].elements[0]; var o

javascript对象的创建和访问_javascript技巧

JavaScript,很少能让人想到它面向对象的特性,甚至有人说它不是面向对象的语言,因为它没有类.没错, JavaScript 真的没有类,但 JavaScript 是面向对象的语言. JavaScript 只有对象,对象就是对象,不是类的实例. 因为绝大多数面向对象语言中的对象都是基于类的,所以经常有人混淆类的实例与对象的概念.对象就是类的实例,这在大多数语言中都没错,但在 JavaScript 中却不适用.JavaScript 中的对象是基于原型的. 创建和访问 JavaScript 中的

JavaScript中访问id对象 属性的方式访问属性(实例代码)_javascript技巧

实例如下: <!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> <meta http-equiv="Co

JavaScript[对象.属性]集锦之二

javascript|对象 复选框(checkbox)对象 属性 name NAME属性的字符串值. value 复选框内容的字符串值.如果设置了,则为"on",否则为"off". checked 复选框内容的布尔值.如果设置了,则为true,否则为false . defaultChecked 反映(CHECKED)属性的布尔值(缺省状态). 方法 click() 选定复选框,并使之状态为"on". 事件处理器 onClick 当用户单击Chec

JavaScript[对象.属性]集锦之一

javascript|对象 SCRIPT 标记 用于包含javascript代码. 语法 属性 LANGUAGE 定义脚本语言 SRC 定义一个URL用以指定以.JS结尾的文件 windows对象 每个HTML文档的顶层对象. 属性 frames[] 子桢数组.每个子桢数组按源文档中定义的顺序存放. feames.length 子桢个数. self 当前窗口. parent 父窗口(当前窗口是中一个子窗口). top 顶层窗口(是所有可见窗口的父窗口). status 浏览器状态窗口上的消息.