我正在尝试使用 jQuery 和 HTML5 localStorage 通过添加到收藏夹实用程序来填充 RSS 提要。我想要实现的是当用户单击 glyphicon-star-empty
时在帖子标题上可用,它更改为 glyphicon-star
(已完成)但它应该将所选/收藏的项目存储在 localStorage
中并在刷新时而不是显示 glyphicon-star-empty
,它应该从 localStorage 获取有关哪个项目被收藏的数据并显示 glyphicon-star
相反。
我面临的问题是在最后一部分。我可以将最喜欢的项目存储在 localStorage 中,但我似乎找不到替换 glyphicon-star-empty
的正确方法与 glyphicon-star
刷新页面时即时查找收藏的项目。
另一个问题是当用户点击 glyphicon-bookmark
时(在标题 -RSS 附近可用)它应该显示所有收藏的项目,并且还应该在取消选择时从 localStorage 和当前页面中删除项目(即单击 glyphicon-star
)
这是完整的代码fiddle .
这是我正在开发的jquery函数:
function blogRSS(url, container) {
var content = $('.data-content'); //console.log(content);
$.ajax({
url: document.location.protocol + '//ajax.googleapis.com/ajax/services/feed/load?v=1.0&num=10&callback=?&q=' + encodeURIComponent(url),
dataType: 'json',
success: function(data) {
console.log(data.responseData.feed);
$.each(data.responseData.feed.entries, function(key, value) {
var thehtml = '<h4><a href="' + value.link + '" target="_blank">' + value.title + '</a></h4>';
$("body").append(itemLayout);
$('.panel-heading').last().html(thehtml);
$('.data-content').last().html(value.content);
$('.data-title').last().next().slideToggle(0);
//console.log($('.panel-heading').last().html(value.title));
//console.log($('.panel-heading').closest('.data-title').text());
if(localStorage.favorite != null){
arr = JSON.parse(localStorage.favorite);
for(var i = 0; i < arr.length; i++){
// console.log($('.panel-heading').last().text() == arr[i].title);
if($('.panel-heading').text() == arr[i].title){
console.log('match');
$('.bkmark_icon').removeClass('glyphicon-star-empty');
$('.bkmark_icon').addClass('glyphicon-star');
//console.log('match');
}
}
}
}); $('.data-title').find('h4').addClass('panel-title');
最佳答案
在 for 循环中添加这样的更改,基本上您需要循环每个列表元素以及 for 循环数组来设置它。
$( ".panel-heading" ).each( function( index, element ){
if($(this).text() == arr[i].title.trim()){
$(this).next().removeClass('glyphicon-star-empty');
$(this).next().addClass('glyphicon-star');
}
});
这是一个修改后的 JSfiddle https://jsfiddle.net/ehqefk6j/2/
关于javascript - 无法从 jQuery RSS Feed 中的 localStorage 动态替换类,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/37331061/