添加到收藏夹数组

Add to Favorites Array

本文关键字：数组 收藏夹 添加      更新时间：2023-09-26

我想在Javascript/Jquery中做的是能够单击按钮(每个项目上的按钮)，将其添加到数组中。当您单击收藏夹页面时，该数组将按顺序发布。

我只是很难理解这是如何工作的。因为我可能希望数组中的每一项都包含一些东西，比如描述该项的图片和文本。

一般来说/举例来说，这将如何设置?

有很多方法可以做到这一点。但是，我将使用一个更一般的 -你可以为自己扩展:

http://jsfiddle.net/TEELr/11/

HTML:这只是用最喜欢的类创建不同的元素——它将是我们检查元素是否被点击的选择器。

<div class="favorite"><p>Add to favorites</p></div>
<div class="favorite type2"><p>Just another favorite type</p></div>
<button id="reveal">
    Reveal Favorites
</button>

JS:

每当一个具有"favorite" CSS类的元素被点击时，它就会被添加到数组中——这也适用于具有多个类(具有"favorite" CSS类)的元素。

现在，当"显示收藏夹"按钮被点击时，它会提醒数组中的内容-这是按点击的顺序(按要求)。

$(document).ready(function() {
    var favorites = [];
    var counter = 0;
    $('.favorite').click(function() {
        ++counter;
        favorites.push("'"" + $(this).text() + " " + counter + "'"");
    });
    $('#reveal').click(function() {
       alert(favorites); 
    });
});
CSS:

简单的CSS，仅用于演示目的，用多个CSS类选择器证明前面的观点:

.favorite {
    width: 400px;
    height: 50px;
    line-height: 50px;
    text-align: center;
    display: block;
    background-color: #f3f3f3;
    border-bottom: 1px solid #ccc;
}
.favorite.type2 {
    background-color: #ff3;
}
.favorite:hover {
    cursor:hand;
    cursor: pointer;
}
相关文章：