1.在silverlight調用javascript函數
用System.Windows.Brower命名空間下的某些silverlight類,你可以調用一段指令碼寫的javascript函數。這樣就給你的silverlight代碼一個很有規律的方式來和頁面互動。
比如:你在HTML頁面中有下邊一段javascript函數
function createText(message,user) { var el = document.getElementById("myElement"); el.innerHTML = user+" "+message; }
調用這個函數,首先用HtmlWindow.GetProperty()方法並把javascript的名字傳進去來得到一個ScriptObjcet對象,然後在調用ScriptObjcet對象的InvokeSelf()方法。調用InvokeSelf方法時,可以把javascript函數的所有參數都傳進去。
ScriptObject scriptObjcet=(ScriptObject)HtmlPage.Window.GetProperty("createText"); scriptObjcet.InvokeSelf("Jerry", "Hello Wolrd");
效果
2.在javascript中調用silverlight方法
在javascript中調用silverlight方法,主要有以下步驟:
1.在silverlight程式中建立一個公開的方法來暴露你想在web頁面中用的函數。
2.在方法上邊添加一個ScriptableMember屬性。
3.在包含這個方法的類上添加ScriptableType屬性。
4.調用HtmlPage.RegisterScriptableObject()將這個方法暴露給javascript。
[ScriptableType()] public partial class InvokeMethod : UserControl { public InvokeMethod() { InitializeComponent(); HtmlPage.RegisterScriptableObject("page", this);
} [ScriptableMember] public void ChangeText(string newText) { txbTest.Text="It's invoking by JavaScript "+newText; } }
註冊一個指令碼化類型時需要指定一個名稱並傳遞一個合適對象的引用,上邊例子中InvokeMethod被註冊時的名稱為page.這樣就告訴silverlight在web頁面的silverlight控制項中建立了另一個叫page的屬性。想調用這個方法,javascript需要找到silverlight控制項,擷取到它的內容然後調用它的page.ChangeText()方法。
function updateSilverlightText() { var ele = document.getElementById("myEle"); ele.content.page.ChangeText("This text has been changed"); }
預設情況下,VS會自動添加一個測試頁面,並給包含<object>元素的DIV一個名稱,但是並沒有給包含在裡邊的<object>對象名稱。你需要自己添加一個名稱以方便擷取<object>對象,上邊例子中的<object>對象名字為myEle。
調用javascript函數
<p onclick="updateSilverlightText()" >Click here to change the text in silverlight</p>
效果
調用前 調用後
3.瀏覽器中執行個體化silverlight對象
和上邊一樣需要建立一個包含ScriptableMember方法的ScriptableType的類
[ScriptableType] public class GetRandom { private Random rdm = new Random(); [ScriptableMember] public int GetRandomNumber(int from,int end) { return rdm.Next(from,end); } }
同樣也需要將這個類註冊一下,這次需要HtmlPage.RegisterCreateableType()方法
HtmlPage.RegisterCreateableType("random", typeof(GetRandom));
建立一個註冊類的執行個體,需要找到silverlight控制項並調用它的ele.content.services.createObject()方法。這個例子中在javascript中調用此方法
function getRandom() { var ele = document.getElementById("myEle"); var r = ele.content.services.createObject("random"); alert("Your number is " + r.GetRandomNumber(1, 56)); }
調用javascript
<input type="button" onclick="getRandom()" value="Click here to get number"/>
效果