@author YHC
在这个教程中我们要去创建一个rss阅读器使用easyUI框架.

查看DEMO
我们将使用以下插件:
- layout:创建一个应用程序界面.
- datagrid: 显示rss feed列表.
- tree:显示feed频道.
步骤1: 创建 Layout
<body class="easyui-layout"> <div region="north" border="false" class="rtitle"> jQuery EasyUI RSS Reader Demo </div> <div region="west" title="Channels Tree" split="true" border="false" style="width:200px;background:#EAFDFF;"> <ul id="t-channels" url="data/channels.json"></ul> </div> <div region="center" border="false"> <div class="easyui-layout" fit="true"> <div region="north" split="true" border="false" style="height:200px"> <table id="dg" url="get_feed.php" border="false" rownumbers="true" fit="true" fitColumns="true" singleSelect="true"> <thead> <tr> <th field="title" width="100">Title</th> <th field="description" width="200">Description</th> <th field="pubdate" width="80">Publish Date</th> </tr> </thead> </table> </div> <div region="center" border="false" style="overflow:hidden"> <iframe id="cc" scrolling="auto" frameborder="0" style="width:100%;height:100%"></iframe> </div> </div> </div> </body>
步骤 2:datagrid处理事件
在这里我们要处理一些由用户触发的事件.
$('#dg').datagrid({ onSelect: function(index,row){ $('#cc').attr('src', row.link); }, onLoadSuccess:function(){ var rows = $(this).datagrid('getRows'); if (rows.length){ $(this).datagrid('selectRow',0); } } });
这个示例使用了'
onSelect'事件显示
feed 的内容和'onLoadSuccess'事件选择第一行.
步骤3:处理tree事件
当tree数据已经加载,我们需要去选择第一个叶子节点,调用'
select'方法去选择那个节点,使用'
onSelect'事件去得到选择节点,所以我们能得到对应的'url'值
最终我们调用datagrid 的'load'方法去刷新feed 列表数据.
$('#t-channels').tree({ onSelect: function(node){ var url = node.attributes.url; $('#dg').datagrid('load',{ url: url }); }, onLoadSuccess:function(node,data){ if (data.length){ var id = data[0].children[0].children[0].id; var n = $(this).tree('find', id); $(this).tree('select', n.target); } } });
下载 EasyUI 示例:
分享到:
相关推荐
使用jQuery easyUI 创建一个 RSS Feed阅读器 Drag and Drop easyUI 基础的拖动和放置 使用easyUI创建一个拖放的购物车 使用easyUI创建一个课程表 Menu and Button 使用easyUI创建简单的菜单 使用easyUI...
本文实例讲述了通过 jQuery EasyUI框架创建一个RSS阅读器,分享给大家供大家参考。具体如下: 运行效果截图如下: 我们将使用以下插件: layout:创建应用的用户界面。 datagrid:显示 RSS Feed 列表。 tree:显示 ...
- **创建 RSS Feed 阅读器**:RSS 是一种用于分享新闻和其他内容的格式,EasyUI 支持创建 RSS 阅读器。 **2. 拖动与放置(Drag & Drop)** - **基本的拖动和放置**:通过 EasyUI 可以轻松实现元素的拖拽功能。 - *...
创建RSS Feed阅读器 创建拖动和放置 创建拖放的购物车 创建一个课程表 创建简单的菜单 按钮与布局 创建Link Button 创建Menu Button 创建Split Button 创建border layout 在panel中创建复杂布局...
2031740029_李浚淇_毕业论文(设计)材料(1) (1).rar
CH7219A-IMG.G000.08.03.05.IMG
是德科技2023下一代无线通信技术6G基础指南英文版40页.pdf
Elasticsearch是一个基于Lucene的搜索服务器
20250414,java面试资料
文档支持目录章节跳转同时还支持阅读器左侧大纲显示和章节快速定位,文档内容完整、条理清晰。文档内所有文字、图表、函数、目录等元素均显示正常,无任何异常情况,敬请您放心查阅与使用。文档仅供学习参考,请勿用作商业用途。 你是否渴望高效解决复杂的数学计算、数据分析难题?MATLAB 就是你的得力助手!作为一款强大的技术计算软件,MATLAB 集数值分析、矩阵运算、信号处理等多功能于一身,广泛应用于工程、科学研究等众多领域。 其简洁直观的编程环境,让代码编写如同行云流水。丰富的函数库和工具箱,为你节省大量时间和精力。无论是新手入门,还是资深专家,都能借助 MATLAB 挖掘数据背后的价值,创新科技成果。别再犹豫,拥抱 MATLAB,开启你的科技探索之旅!
文档支持目录章节跳转同时还支持阅读器左侧大纲显示和章节快速定位,文档内容完整、条理清晰。文档内所有文字、图表、函数、目录等元素均显示正常,无任何异常情况,敬请您放心查阅与使用。文档仅供学习参考,请勿用作商业用途。 你是否渴望高效解决复杂的数学计算、数据分析难题?MATLAB 就是你的得力助手!作为一款强大的技术计算软件,MATLAB 集数值分析、矩阵运算、信号处理等多功能于一身,广泛应用于工程、科学研究等众多领域。 其简洁直观的编程环境,让代码编写如同行云流水。丰富的函数库和工具箱,为你节省大量时间和精力。无论是新手入门,还是资深专家,都能借助 MATLAB 挖掘数据背后的价值,创新科技成果。别再犹豫,拥抱 MATLAB,开启你的科技探索之旅!
本文详细分析了中国房地产行业竞争格局的变化趋势,指出央国企市场份额显著提升,而民营房企受市场冲击较大,但未来在市场重新平衡后,民营房企的市场份额或将有所恢复。核心城市及成熟城市群成为房企聚焦的重点,行业集中度下降,千亿企业数量急剧减少,新势力房企崛起。专业化是房企未来发展的方向,轻资产、资产管理等领域将迎来发展机遇,代建企业与资产管理公司(AMC)凭借其专业能力在行业调整中获得更多机会。此外,数智化营销借助大数据、人工智能等技术,正重塑房地产营销的各个环节,提高营销效率和服务质量。
51单片机温湿度计、这个分支采用低功耗蓝牙(BLE)接收数据。 硬件有很多替代品,你也可以选择自己喜欢的硬件进行开发&复刻。蓝牙调试、随便找一款能够进行蓝牙串口调试的软件就行了。
Matlab领域上传的视频是由对应的完整代码运行得来的,完整代码皆可运行,亲测可用,适合小白; 1、从视频里可见完整代码的内容 主函数:main.m; 调用函数:其他m文件;无需运行 运行结果效果图; 2、代码运行版本 Matlab 2019b;若运行有误,根据提示修改;若不会,私信博主; 3、运行操作步骤 步骤一:将所有文件放到Matlab的当前文件夹中; 步骤二:双击打开main.m文件; 步骤三:点击运行,等程序运行完得到结果; 4、仿真咨询 如需其他服务,可私信博主; 4.1 博客或资源的完整代码提供 4.2 期刊或参考文献复现 4.3 Matlab程序定制 4.4 科研合作
内容概要:本文系统介绍了数据结构这门计算机科学核心课程,强调其作为程序世界骨架的重要性。首先解释了数据结构的概念,即计算机中组织、管理和存储数据的方式,以确保数据能被高效访问和修改。接着列举了经典的数据结构及其应用场景,包括数组、链表、栈、队列、哈希表、树、图和堆,并简要说明了每种结构的操作复杂度。然后归纳了常见知识点与典型题型,涵盖线性结构、树与二叉树、哈希与散列、图论基础以及查找与排序算法。文中还提供了多个课程设计/项目的示例,如通讯录管理
Java新学习计划.zip
该报告由美国房地产经纪人协会发布,深入探讨了2022年美国家装改造的趋势、成本及业主满意度。报告指出,家装改造的原因多样,包括升级陈旧表面、增加功能性和改善居住体验等。疫情期间,家装项目规模有所扩大,约60%的受访者表示因疫情而增加了改造面积或项目数量。报告还提供了19项室内和室外改造项目的典型成本及预期回收价值,如重新铺设硬木地板可回收147%的成本,地下室改造成生活区的成本回收率为86%。此外,报告引入了“Joy Score”来衡量业主对项目的满意度,多个项目获得了满分10分。
内容概要:本文介绍了 Go 语言的特点、应用场景、基础语法、并发编程优势、常用框架与工具链、项目结构以及学习路线。Go 语言由 Google 推出,具有简洁高效的语法、原生并发支持和优越的性能,适用于 Web 后端开发、云原生、微服务架构、网络编程和工具开发等多个领域。文中还提供了第一个 Go 程序示例、模块与包管理、创建 Goroutine 和使用 Channel 的代码片段。最后给
打印机修复局域网共享软件等
通过UniApp+vueJs+renderJs的前端框架实现一个AI对话的小功能,AI回答使用流式请求,响应流式输出的小案例。解决兼容低版本的手机端运行不支持流式Fetch的请求方式;