使用jQuery的ajax功能实现的RSS Reader 代码


Posted in Javascript onSeptember 03, 2009

先看看效果来着:

使用jQuery的ajax功能实现的RSS Reader 代码

首先需要一个ascx页面通过一个XDocument把rss源的内容绑定到一个ListView上。代码如下:

protected void Page_Load(object sender, EventArgs e) 
{ 
// For demo purposes. 
System.Threading.Thread.Sleep(1000); XDocument feedXML = 
XDocument.Load("http://feeds.feedsky.com/csdn.net/dujingjing1230"); 
var feeds = from feed in feedXML.Descendants("item") 
select new 
{ 
Title = feed.Element("title").Value, 
Link = feed.Element("link").Value, 
Description = feed.Element("description").Value 
}; 
PostList.DataSource = feeds; 
PostList.DataBind(); 
}

<asp:ListView runat="server" ID="PostList"> 
<LayoutTemplate> 
<ul> 
<asp:PlaceHolder runat="server" ID="itemPlaceholder" /> 
</ul> 
</LayoutTemplate> 
<ItemTemplate> 
<li><a href='<%# Eval("Link") %>'><%# Eval("Title") %></a><br /> 
<%# Eval("Description") %> 
</li> 
</ItemTemplate> 
</asp:ListView>

接下来需要创建一个aspx页面来显示RSS内容,当然这个页面中就使用了jQuery的AJAX来得到上面的数据。
HTML页面代码:
使用jQuery的ajax功能实现的RSS Reader 代码
实现ajax功能的js:
$(document).ready(function() { 
$.ajax({ 
type: "POST", 
url: "RSSReader.asmx/GetRSSReader", 
data: "{}", 
contentType: "application/json; charset=utf-8", 
dataType: "json", 
success: function(msg) { 
$('#RSSContent').removeClass('loading'); 
$('#RSSContent').html(msg.d); 
} 
}); 
});

最后是RSSReader.asmx这个web Services的内容:
public class RSSReader : System.Web.Services.WebService { 
[WebMethod] 
public string GetRSSReader() 
{ 
Page page = new Page(); 
UserControl ctl = 
(UserControl)page.LoadControl("~/RSSReaderControl.ascx"); 
page.Controls.Add(ctl); 
StringWriter writer = new StringWriter(); 
HttpContext.Current.Server.Execute(page, writer, false); 
return writer.ToString(); 
} 
}

页面中还有用到一个图片这里就不上传了。
代码下载:
http://xiazai.3water.com/200909/yuanma/RSSREader.rar
Javascript 相关文章推荐
JQuery 写的个性导航菜单
Dec 24 Javascript
精通JavaScript的this关键字
May 28 Javascript
JS实现图片平面旋转的方法
Mar 01 Javascript
VUEJS实战之修复错误并且美化时间(2)
Jun 13 Javascript
简单封装js的dom查询实例代码
Jul 08 Javascript
jQuery自定义元素右键点击事件(实现案例)
Apr 28 jQuery
JS中定位 position 的使用实例代码
Aug 06 Javascript
jQuery实现根据身份证号获取生日、年龄、性别等信息的方法
Jan 09 jQuery
详解vue项目中实现图片裁剪功能
Jun 07 Javascript
JS将指定的某个字符全部转换为其他字符实例代码
Oct 13 Javascript
对vue生命周期的深入理解
Dec 03 Vue.js
vue css 相对路径导入问题级踩坑记录
Jun 05 Vue.js
一步一步教你写一个jQuery的插件教程(Plugin)
Sep 03 #Javascript
动态样式类封装JS代码
Sep 02 #Javascript
JS URL传中文参数引发的乱码问题
Sep 02 #Javascript
FF IE兼容性的修改小结
Sep 02 #Javascript
js 获取浏览器高度和宽度值(多浏览器)
Sep 02 #Javascript
获取URL地址中的文件名和参数的javascript代码
Sep 02 #Javascript
Javascript 判断函数类型完美解决方案
Sep 02 #Javascript
You might like
php实现json编码的方法
2015/07/30 PHP
thinkphp中的url跳转用法分析
2016/07/12 PHP
PHP url的pathinfo模式加载不同控制器的简单实现
2016/08/12 PHP
基于Laravel 多个中间件的执行顺序详解
2019/10/21 PHP
JQuery 将元素显示在屏幕的中央的代码
2010/02/27 Javascript
Jquery Ajax学习实例3 向WebService发出请求,调用方法返回数据
2010/03/16 Javascript
主页面中的两个iframe实现鼠标拖动改变其大小
2013/04/16 Javascript
javascript 数组排序函数sort和reverse使用介绍
2013/11/21 Javascript
全面解析Bootstrap弹窗的实现方法
2015/12/01 Javascript
详解Vue自定义过滤器的实现
2017/01/10 Javascript
jQuery使用EasyUi实现三级联动下拉框效果
2017/03/08 Javascript
详解vue跨组件通信的几种方法
2017/06/15 Javascript
vue-resource 拦截器(interceptor)的使用详解
2017/07/04 Javascript
JS获取填报扩展单元格控件的值的解决办法
2017/07/14 Javascript
在Debian(Raspberry Pi)树莓派上安装NodeJS的教程详解
2017/09/19 NodeJs
JavaScript实现图片本地预览功能【不用上传至服务器】
2017/09/20 Javascript
解决Mac下安装nmp的淘宝镜像失败问题
2018/05/16 Javascript
Javascript组合继承方法代码实例解析
2020/04/02 Javascript
JavaScript实现京东快递单号查询
2020/11/30 Javascript
[02:36]DOTA2上海特锦赛 回忆电竞生涯的重要瞬间
2016/03/25 DOTA
python中字符串前面加r的作用
2015/06/04 Python
Python实现配置文件备份的方法
2015/07/30 Python
基于python实现微信模板消息
2015/12/21 Python
Python中利用aiohttp制作异步爬虫及简单应用
2018/11/29 Python
使用pyinstaller打包PyQt4程序遇到的问题及解决方法
2019/06/24 Python
Python 实现Serial 与STM32J进行串口通讯
2019/12/18 Python
Python自动重新加载模块详解(autoreload module)
2020/04/01 Python
巴西最大的玩具连锁店:Ri Happy
2020/06/17 全球购物
阿迪达斯越南官网:adidas越南
2020/07/19 全球购物
腾讯公司的一个sql题
2013/01/22 面试题
shell程序如何生命变量?shell变量是弱变量吗?
2014/11/10 面试题
《美丽的小兴安岭》教学反思
2014/02/26 职场文书
企业职业病防治方案
2014/05/29 职场文书
英语感谢信范文
2015/01/20 职场文书
老乡会致辞
2015/07/28 职场文书
Python中re模块的元字符使用小结
2022/04/07 Python