您的位置:首页 > Web前端 > JavaScript

Silverlight与JavaScript相互调用

2012-06-05 11:18 239 查看
1.sl调用js
比如我们在页面中定义一个js函数:
<script type="text/javascript">

        function fnTest(msg) {

            alert('fnTest:' + msg);

        }

    </script>
sl中可以有二种调用方式:
HtmlPage.Window.CreateInstance("fnTest", "CreateInstance");
或者
HtmlPage.Window.Invoke("fnTest", "Invoke");
运行的效果完全相同,但是建议用Invoke方法,原因是:
CreateInstance是HtmlWindow中定义的方法,而HtmlWindow继承自HtmlObject,再向上找HtmlObject又继承ScriptObject,最终调用的还是ScriptObject中的Invoke方法,所以用CreateInstance绕来绕去,最终还是绕到了Invoke上,还不如一步到位直接Invoke更高效。

2.sl修改dom元素属性
比如页面中有一个文本框: <input type="text" id="txtTarget" name="txtTarget" />
sl中同样也有二种方法调用:
HtmlPage.Document.GetElementById("txtTarget").SetAttribute("value", "Silverlight");

HtmlPage.Document.GetElementById("txtTarget").SetProperty("value", "Silverlight");
功能完全相同,同样建议用SetProperty方法,理由同上

3.sl为dom元素附加事件

HtmlPage.Document.GetElementById("txtTarget").AttachEvent("focus", new EventHandler(AttachJsMethod));

private void AttachJsMethod(object o, EventArgs e)

{

   HtmlPage.Window.Invoke("fnTest", "silverlight");

}

以上代码将为txtGarget文本框附加onfocus事件处理函数:fnTest
 
4.js调用sl中的方法,属性

sl部分的关键处理是:要在暴露出来的方法/属性前加上[ScriptableMember()],参考下面的代码:

[ScriptableMember()]

public string Hello(string Msg)

{

    return "Hello ," + Msg;

}

[ScriptableMember()]

public void Test(string msg)

{

    MessageBox.Show("From Silverlight:" + msg);

}

private string _myName = "";
[ScriptableMember()]

public string MyName { set { _myName = value; } get { return _myName.Length == 0 ? "MyName Test" : _myName; } }
 
这里定义二个方法(一个有返回值,一个没返回值),外加一个属性
 
然后要在App.Xaml.cs中注册类型,参考下面这样:
private void
Application_Startup(object sender, StartupEventArgs e)

{

            MainPage mp = new MainPage();

            this.RootVisual = mp;

            HtmlPage.RegisterScriptableObject("myMainPage", mp);
}
 
js中这可以使用了,不过得先给silverlight的object标签加一个参数,参考下面这样:

<object data="data:application/x-silverlight-2," type="application/x-silverlight-2"

            width="100%" height="100%">

            <param name="source" value="ClientBin/JavaScriptInvoke.xap" />

            <param name="onError" value="onSilverlightError" />

            <param name="background" value="white" />

            <param name="minRuntimeVersion" value="3.0.40818.0" />

           <param name="onLoad" value="SilverlightLoaded" />

            <param name="autoUpgrade" value="true" />

            <a href="http://go.microsoft.com/fwlink/?LinkID=149156&v=3.0.40818.0" style="text-decoration: none">

                <img src="http://go.microsoft.com/fwlink/?LinkId=108181" alt="Get Microsoft Silverlight"

                    style="border-style: none" />

            </a>

        </object>

然后定义对应的函数:

<script type="text/javascript">
   var slCtl = null;
        function
SilverlightLoaded(sender) {

            slCtl = sender.getHost();

            alert(slCtl.Content.myMainPage.Hello("JavaScript"));

        }
 
 
  var
fnClickTest = function() {

            if (slCtl != null) {

                slCtl.Content.myMainPage.Test("Hi")
                alert(slCtl.Content.myMainPage.MyName);

            }

        }
</script>
为了测试fnClickTest,可以在页面中加一个button,类似这样:
<button onclick="fnClickTest()">调用SL中的方法</button>
 
说明:SilverlightLoaded会在silverlight控件加载完成时触发,触发完了以后,slCtl这个全局变量就保留了对silverlight的引用,其它地方就能继续调用silverlight中的各种方法和属性了
来自: http://hi.baidu.com/dongdongjiao/blog/item/ed953eaf6d5f14f6fbed5091.html
附加一种情况:当只存在Silverlight 文件时,通过页面注册js函数实现:
(文章出处:http://www.51crazy.net/Article/205.aspx

 Silverlight 3 调用Js函数

Silverlight像页面注册js函数:

string jsstr = "function calljs(msg){alert(msg);}"; 
HtmlElement element = HtmlPage.Document.CreateElement( "Script" ); 
element.SetAttribute( "type", "text/javascript" ); 
element.SetAttribute( "text", jsstr ); 
 
HtmlPage.Document.Body.AppendChild( element ); 

调用JS函数:

HtmlPage.Window.Invoke( "dragdrop", dcmExportRequest.ToString() );  
  
ScriptObject calljs = (ScriptObject)HtmlPage.Window.GetProperty( "dragdrop" );  
calljs.InvokeSelf( dcmExportRequest.ToString() );  

调用js参数或设置值:

HtmlWindow win = HtmlPage.Window; 
win.Alert( "Silverlight 里面弹出的对话框。 " ); 
//执行页面中的js函数: 
win.Eval( "getArrayTest()" ); 
win.Eval( "var test=/"dfdsfgdsfgsfd/";" );
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: