我在網頁上使用類別，我建立了下一個視圖來顯示類別。我創建了一個解決方案，如何對應用程序中的所有數據進行分類。但是我有一些我無法解決的問題。所以問題是，當我第一次打開我的網頁時，列表中的所有類別都是可見的，而我希望類別僅在類別項按下后才需要可見。我的代碼：$(document).ready(function () {    $('.category_list .category_item[category="all"]').addClass('ct_item-active');    $('.category_item').click(function () {        var catProduct = $(this).attr('category');        console.log(catProduct);        $('.category_item').removeClass('ct_item-active');        $(this).addClass('ct_item-active');        $('.product-item').css('transform', 'scale(0)');        function hideProduct() {            $('.product-item').hide();        } setTimeout(hideProduct, 400);        function showProduct() {            $('.product-item[category="' + catProduct + '"]').show();            $('.product-item[category="' + catProduct + '"]').css('transform', 'scale(1)');        } setTimeout(showProduct, 400);    });});.wrap {    max-width: 1100px;    width: 90%;    margin: auto;}.wrap > h1 {    color: #494B4D;    font-weight: 400;    display: flex;    flex-direction: column;    text-align: center;    margin: 15px 0px;}.wrap > h1:after {    content: '';    width: 100%;    height: 1px;    background: #C7C7C7;    margin: 20px 0;}.store-wrapper {    display: flex;    flex-wrap: wrap;}.category_list {    display: flex;    flex-direction: column;    width: 30%;}.category_list .category_item {    display: block;    width: 100%;    padding: 15px 0;    margin-bottom: 20px;    background: #E84C3D;    text-align: center;    text-decoration: none;    color: #fff;}.category_list .ct_item-active {    background: #2D3E50;}.products-list {    width: 70%;    display: flex;    flex-wrap: wrap;}.products-list .product-item {    width: 35%;    margin-left: 3%;    margin-bottom: 25px;    box-shadow: 0px 0px 6px 0px rgba(0,0,0,0.22);    display: flex;    flex-direction: column;    align-items: center;    align-self: flex-start;    transition: all .4s;}因此，如您所見，我沒有在首頁顯示所有類別的func。但是，當我重新加載頁面時，所有類別均可見，此時我不是3，但是我有3個以上，并且我想在按類別項目后顯示此類別。