移动端开发-JqueryMobile实战(一)

来源:互联网 发布:淘宝号被冻结 编辑:程序博客网 时间:2024/05/16 12:38

又来写一篇教程,是因为最近在图书馆看到了一本书《jQuery移动Web开发》,因为以前没有怎么关注过移动端的开发,于是就把jQuery Mobile看了一下,并想根据书中最后一节讲的创建一个RSS阅读器应用程序。看看途中会不会遇到什么坑。
index.html页面,没什么可说的,感觉jQuery Mobile的样式还挺好看的,使用data-role来指定page,header,content

<!DOCTYPE html><html><title>RSS Reader App</title><meta name="viewport" content="width=device-width,initialscale=1"><!-- 这一行就是为移动端所写的 --><link rel="stylesheet" href="https://apps.bdimg.com/libs/jquerymobile/1.4.5/jquery.mobile-1.4.5.min.css"><script src="https://apps.bdimg.com/libs/jquery/1.10.2/jquery.min.js"></script><script src="https://apps.bdimg.com/libs/jquerymobile/1.4.5/jquery.mobile-1.4.5.min.js"></script><body>    <div data-role="page" id="intropage">        <div data-role="header">            <h1>RSS Reader Application</h1>        </div>        <div data-role="content" id="introContent">            <p id="introContentNoFeeds" style="display: none">                Welcom to the Rss Reader Application.You do not Currently have any Rss Feeds.Please use 'Add Feed' Button below to begin.            </p>            <ul id="feedList" data-role="listview" data-inset="true" datalisplit-icon="delete">            </ul>            <a href="addfeed.html" data-role="button" data-theme="b">Add Feed</a>        </div>        <div datd-role="footer">            <h4>Created with jQuery Moile</h4>        </div>    </div></body><script>    $(document).on("pagecreate",'#intropage',function(e){        // init();    })</script>

然后界面就是这样
这里写图片描述

阅读全文
0 0
原创粉丝点击