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

xiaoxiao2021-02-28  94

又来写一篇教程,是因为最近在图书馆看到了一本书《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>

然后界面就是这样

转载请注明原文地址: https://www.6miu.com/read-80282.html

最新回复(0)