[Silverlight探秘]深入探索Silverlight与Javascript的交互

简介:

*                                                 版权声明
*
* 本文以Creative Commons的知识共享署名-非商业性使用-相同方式共享发布,请严格遵循该授权协议。
* 本文首发于博客园, 此声明为本文章中不可或缺的一部分。
* 作者网名:    浪子
* 作者EMAILdayichen (at)163.com
* 作者BLOG:  Http://Www.Cnblogs.Com/Walkingboy
*
********************************************************************

[Silverlight探秘]深入探索Silverlight与Javascript的交互

-Written by 浪子@cnblogs.com  (07-07-01)

摘要

[Silverlight探秘]利用Javascript调用silverlight的方法[Silverlight探秘]利用Silverlight调用Javascript的方法中,大概的学习了两者之间如何进行简单的交互,但是两次探索中都遗留了些问题,本文对这些问题进行了深入的尝试,在这个过程中学习理解两者之间的更深入更复杂的交互场景。

本文环境

  • Codename Orcas Beta1
  • Silverlight 1.1 Alpha
  • IE 6.0

问题一、Javascript调用Silverlight的方法获得的返回值支持什么类型的?对于复杂类型如何处理?

[Silverlight探秘]利用Javascript调用silverlight的方法中,我提出了这个疑问,silverlightfans兄认为为复杂的类型贴上Scriptable的标签即可支持将其序列化为javascript的对象。在我试用scriptable的时候,我也这样子认为,于是我做了如下尝试:

    [Scriptable]
    public MyClass ReturnClass()
{
return new MyClass() { Name = "walkingboy", Blog = "http://walkingboy.cnblogs.com"};
}
    [Scriptable]
public class MyClass
{
[Scriptable]
public string Name
{
get;
set;
}
[Scriptable]
public string Blog
{
get;
set;
}
public DateTime BirthDay { get; set; }
}

不幸的是,如果你真的这样子做,将会得到如下错误信息

---------------------------
Microsoft Internet Explorer
---------------------------

Silverlight error message    
ErrorCode: 1001
ErrorType: ParserError      
Message: AG_E_UNKNOWN_ERROR    
XamlFile: Page.xaml    
Line: 9    
Position: 27

可见silverlight并不能自动转换一个复杂的类型到javascript类型上。在网上查阅了一些资料,原来silverlight目前还只支持序列化一些普通的类型(字符串、数字、数组等),我把这些普通类型理解为javascript内置的类型。

那如何解决我们的复杂对象返回呢?还好silverlight内置了对json的支持,我们可以直接将复杂对象序列化为json格式的字符串,然后在javascript进行反序列化,就像我们现在开发ajax应用中的一样。

silverlight的json序列化支持类包含在Microsoft.Silverlight.dll下的System.Windows.Browser.Serialization命名空间中。

JavaScriptSerializer jss = new JavaScriptSerializer();
//json序列化
string json = jss.Serialize(instance);
//json反序列化
MyClass instance = jss.Deserialize<MyClass> (json);
此类的功能跟asp.net ajax中的类基本类似,可以参考相关的资料(如Jeffrey Zhao深入Atlas系列:探究序列化与反序列化能力)。
问题二、Silverlight调用Javascript方法是否可以返回指定的类型参数?
经过上面的测试,我甚至担心这个问题也只能通过json序列化来解决。为了测试这个问题,我写了如下的测试代码
    [Scriptable]
public class MyEventArgs : EventArgs
{
public MyEventArgs()
{
}
[Scriptable]
public string Message
{
get;
set;
}
}
定义好了自定义的EventArgs之后,按照[Silverlight探秘]利用Silverlight调用Javascript的方法中的方法,设置一个Scriptable的Event
[Scriptable]
public event EventHandler<MyEventArgs> ReturnArgs;
测试结果运行正常,于是想是否支持有返回值的委托呢?
public delegate string ReturnCustomerEventArgsEventHandler(MyEventArgs args);
[Scriptable]
public event ReturnCustomerEventArgsEventHandler ReturnArgs;

照样运行起来之后得到如下错误

---------------------------
Microsoft Internet Explorer
---------------------------

Silverlight error message    
ErrorCode: 1001
ErrorType: ParserError      
Message: AG_E_UNKNOWN_ERROR    
XamlFile: Page.xaml    
Line: 9    
Position: 27   

 

看来不能用此种方式获取javascript的运行返回值。

综合

其实感觉有点奇怪,即然Silverlight可以通过Event传递一个自定义类型的参数给javascript方法,为什么javascript调用Silverlight方法反而不行?原则上两者其实是一样的。我想不同在于一个是“推”,一个是“拉”,期待正式版中能内嵌支持返回自定义类型的结果值,就省去自己序列化的麻烦了。

结合一下上面的两个交互场景,其实跟ajax的实现场景有点类似了,我觉得完全可以通过silverlight替代现有的ajax方法,当然这个后面我会进一步去测试。

BTW:如果你的类中没有一个方法,属性,事件贴有Scriptable,而你在构造器中调用

WebApplication.Current.RegisterScriptableObject("LangZi", this);

则你将得到一个解析错误

---------------------------
Microsoft Internet Explorer
---------------------------

Silverlight error message    
ErrorCode: 2210
ErrorType: ParserError      
Message: AG_E_INVALID_ARGUMENT    
XamlFile: Page.xaml    
Line: 10    
Position: 72 

测试代码:ScriptableAdvance.rar

废话一句,MS的Blend真是不咋地:(


本文转自浪子博客园博客,原文链接:http://www.cnblogs.com/walkingboy/archive/2007/07/01/Silverlight_scriptableadvance.html,如需转载请自行联系原作者
目录
打赏
0
0
0
0
20
分享
相关文章
Midscene.js:AI 驱动的 UI 自动化测试框架,支持自然语言交互,生成可视化报告
Midscene.js 是一款基于 AI 技术的 UI 自动化测试框架,通过自然语言交互简化测试流程,支持动作执行、数据查询和页面断言,提供可视化报告,适用于多种应用场景。
763 1
Midscene.js:AI 驱动的 UI 自动化测试框架,支持自然语言交互,生成可视化报告
揭秘:如何让你的asp.net页面变身交互魔术师——先施展JavaScript咒语,再引发服务器端魔法!
【8月更文挑战第16天】在ASP.NET开发中,处理客户端与服务器交互时,常需先执行客户端验证再提交数据。传统上使用ASP.NET Button控件直接触发服务器事件,但难以插入客户端逻辑。本文对比此法与改进方案:利用HTML按钮及JavaScript手动控制表单提交。后者通过`onclick`事件调用JavaScript函数`SubmitForm()`来检查输入并决定是否提交,增强了灵活性和用户体验,同时确保了服务器端逻辑的执行。
80 5
JavaScript 与 DOM 交互的基础及进阶技巧,涵盖 DOM 获取、修改、创建、删除元素的方法,事件处理,性能优化及与其他前端技术的结合,助你构建动态交互的网页应用
本文深入讲解了 JavaScript 与 DOM 交互的基础及进阶技巧,涵盖 DOM 获取、修改、创建、删除元素的方法,事件处理,性能优化及与其他前端技术的结合,助你构建动态交互的网页应用。
102 5
聊聊 Go 语言中的 JSON 序列化与 js 前端交互类型失真问题
在Web开发中,后端与前端的数据交换常使用JSON格式,但JavaScript的数字类型仅能安全处理-2^53到2^53间的整数,超出此范围会导致精度丢失。本文通过Go语言的`encoding/json`包,介绍如何通过将大整数以字符串形式序列化和反序列化,有效解决这一问题,确保前后端数据交换的准确性。
86 4
【JavaScript】网页交互的灵魂舞者
本文介绍了 JavaScript 的三种引入方式(行内、内部、外部)和基础语法,包括变量、数据类型、运算符、数组、函数和对象等内容。同时,文章还详细讲解了 jQuery 的基本语法和常用方法,如 `text()`、`html()`、`val()`、`attr()` 和 `css()` 等,以及如何插入和删除元素。通过示例代码和图解,帮助读者更好地理解和应用这些知识。
62 1
【JavaScript】网页交互的灵魂舞者
揭秘!前端大牛们如何巧妙利用JavaScript,打造智能交互体验!
【10月更文挑战第30天】前端开发领域充满了无限可能与创意,JavaScript作为核心语言,凭借强大的功能和灵活性,成为打造智能交互体验的重要工具。本文介绍前端大牛如何利用JavaScript实现平滑滚动、复杂动画、实时数据更新和智能表单验证等效果,展示了JavaScript的多样性和强大能力。
107 4
JavaScript 与 DOM 交互
【9月更文挑战第01天】
51 2
Vue.js动画魔法:解锁流畅过渡,让每一次交互都成为用户心中的小确幸!
【8月更文挑战第30天】在Vue.js中,动画与过渡效果不仅是视觉点缀,更是提升用户体验的关键。通过流畅的动态效果,应用的互动性和吸引力得以增强,从而提高用户满意度和参与度。`&lt;transition&gt;`和`&lt;transition-group&gt;`组件结合CSS过渡,可轻松实现元素的进入、离开及列表变化动画。合理的性能优化,如使用硬件加速,能避免页面卡顿,确保动画既美观又高效。下面是一个简单的淡入淡出效果示例,展示了如何利用Vue.js实现平滑的动画过渡。总之,恰当的动画设计能显著提升应用的用户体验。
97 0
Vue.js动画魔法:解锁流畅过渡,让每一次交互都成为用户心中的小确幸!
JSF遇上DevOps:开发流程将迎巨变?一篇文章带你领略高效协同的魅力!
【8月更文挑战第31天】本文探讨了如何在JavaServer Faces(JSF)开发中融入DevOps文化,通过持续集成与部署、自动化测试、监控与日志记录及反馈机制,提升软件交付速度与质量。文中详细介绍了使用Jenkins进行自动化部署、JUnit与Selenium进行自动化测试、ELK Stack进行日志监控的具体方法,并强调了持续改进的重要性。
60 0
从零开始学表单操作,jQuery 与原生 JavaScript 完全指南,带你轻松掌握网页交互关键!
【8月更文挑战第31天】在网页开发中,表单是实现用户互动的关键元素。无论是收集信息、提交数据还是验证输入,都需要对表单进行有效操作。本文档介绍了如何使用原生 JavaScript 和 jQuery 操作表单,包括获取表单元素、读写表单值、处理表单提交及验证等核心功能。jQuery 提供了更简洁的语法和更好的兼容性,但原生 JavaScript 在性能上有优势。选择合适的方法取决于项目需求和个人偏好。下面通过具体示例展示了两种方式的操作方法。
59 0

热门文章

最新文章

AI助理

你好,我是AI助理

可以解答问题、推荐解决方案等