彩票走势图

logo jQuery EasyUI使用教程
文档彩票走势图>>jQuery EasyUI使用教程>>jQuery EasyUI使用教程:创建一个RSS阅读器

jQuery EasyUI使用教程:创建一个RSS阅读器


Kendo UI for jQuery——创建现代Web应用程序的最完整UI库!查看详情>>>

<jQuery EasyUI最新版下载>

在本文中,我们将使用jQuery EasyUI框架创建一个RSS阅读器。

我们将使用以下插件:

  • layout:创建应用程序的用户界面
  • datagrid:显示RSS Feed列表
  • tree:显示Feed频道

Step 1:创建布局

jQuery EasyUI RSS Reader Demo
Title Description Publish Date

Step 2:处理数据网格的事件

在这里,我们需要处理一些由用户触发的事件。

$('#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'事件来选择第一行。

Step 3:处理tree的事件

当tree数据被加载时,我们需要选择第一个子节点,调用'select'方法来选择该节点。使用'onSelect'事件来获得被选择的节点,这样就能得到对应的'url'值。最后,我们调用数据网格的'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示例:

购买最新正版授权!<>

扫码咨询


添加微信 立即咨询

电话咨询

客服热线
023-68661681

TOP