0

我有一个页面，用户可以在其中“喜欢”一篇文章。

当页面首次加载时，我想显示他们是否已经喜欢过一篇文章。

我用来将 html 添加到 DOM 的代码是：

html += '<div class="gl_like">';
html += '<a href="#" class="like" id="'+image.article_id+'"><div class="bLike" title="Like this article"></div></a>';
html += '<a href="#" class="unlike" id="'+image.article_id+'"><div class="bUnlike" title="Unlike this article"></div></a>';
html += '</div>';

现在我正在检查 API 所返回的内容，以了解用户是否已经喜欢过一篇文章

if(image.numLikes<1){
$('.like').show();
$('.unlike').hide();
html += 'wooo'; // to test the code works, it does
} else {
$('.like').hide();
$('.unlike').show();
}

“wooo”被添加到 html，但显示/隐藏功能被忽略。“.like”类显示在每篇文章中。

我想要发生的是“.like”类显示如果用户不喜欢一篇文章，“.unlike”类显示如果他们有。

我在这里错过了什么吗？

4

3 回答 3

2

您是否将 html 添加到 DOM 的任何地方？

如果没有，试试这个：

$(html).find('.like').show();
$(html).find('.unlike').hide();
于 2013-01-17T19:31:48.453 回答
0

您正在创建具有重复 id 属性的元素： id="'+image.article_id+'" 您需要更改它，以便它们是唯一的，这是必需的。前任：

html += '<div class="gl_like">';
html += '<a href="#" class="like" id="like_'+image.article_id+'"><div class="bLike" title="Like this article"></div></a>';
html += '<a href="#" class="unlike" id="unlike_'+image.article_id+'"><div class="bUnlike" title="Unlike this article"></div></a>';
html += '</div>';
于 2013-01-17T19:11:00.390 回答
0

明白了，谢谢各位：

if(image.numLikes<1){
    html += '<a href="#" class="like" id="'+image.article_id+'"><div class="bLike" title="Like this article"></div></a>';
    html += '<a href="#" class="unlike" id="'+image.article_id+'" style="display:none;"><div class="bUnlike" title="Unlike this article"></div></a>';
    } else {
    html += '<a href="#" class="like" id="'+image.article_id+'" style="display:none;"><div class="bLike" title="Like this article"></div></a>';
    html += '<a href="#" class="unlike" id="'+image.article_id+'"><div class="bUnlike" title="Unlike this article"></div></a>';
    }

而不是使用显示/隐藏它更容易从字面上显示或隐藏。

不确定我是否也很好地解释了这个问题，对此表示歉意，但感谢大家的回答。

于 2013-01-17T19:36:47.163 回答