jQuery Mobile 是一個用于創建移動應用程序的框架，包含了很多實用的組件和功能，可以幫助你快速構建一個移動應用程序。其中最受歡迎的功能之一就是收藏功能，它允許用戶將網站上的內容快速保存到自己的收藏夾中。下面我們來看看如何在移動應用程序中使用 jQuery Mobile 實現收藏功能。
步驟一：引入 jQuery Mobile 庫
<head> <script src="https://code.jquery.com/jquery-1.12.4.min.js"></script> <link rel="stylesheet" > <script src="https://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.js"></script> </head>
步驟二：創建一個收藏按鈕
<a href="#" class="ui-btn ui-corner-all ui-shadow ui-btn-inline ui-icon-star ui-btn-icon-left">添加到收藏夾</a>
步驟三：保存收藏內容到本地存儲
$('.ui-btn').click(function(){
var url = window.location.href;
var title = document.title;
var favorites = JSON.parse(localStorage.getItem('favorites') || '[]');
var item = {
url: url,
title: title
};
favorites.push(item);
localStorage.setItem('favorites', JSON.stringify(favorites));
});步驟四：顯示保存的收藏內容
$(document).on('pagebeforeshow', '#favorites', function(){
var favorites = JSON.parse(localStorage.getItem('favorites') || '[]');
var list = '';
for(var i=0;i<favorites.length;i++){
list += '<li><a href="'+favorites[i].url+'">'+favorites[i].title+'</a></li>';
}
$('#favorites-list').html(list);
});以上就是使用 jQuery Mobile 實現收藏功能的完整步驟。通過這個功能，用戶可以方便地保存自己感興趣的網頁，隨時查看已收藏的內容，提高了移動應用程序的用戶體驗。希望這篇文章能夠幫助到您！
下一篇用css讓圓點居中