Javascript-форум (https://javascript.ru/forum/)
-   Элементы интерфейса (https://javascript.ru/forum/dom-window/)
-   -   Тушим ранее выбранные картинки (https://javascript.ru/forum/dom-window/83318-tushim-ranee-vybrannye-kartinki.html)

colgol80 16.11.2021 11:17

Тушим ранее выбранные картинки
 
Вложений: 1
Добрый день) не могу сообразить как погасить картинки которые были ранее нажаты, т.е. чтобы нельзя было одновременно выбрать более одного животного. прилагаю код и весь проект в архиве, чтобы было понятнее.

$(document).ready(function(){
    $('.grid-item:not(.active)').click(function(){
        $('.grid-item').removeClass('active');
        $(this).addClass('active');
        get_background_image_name($(this).find('.image-item'));
        
    });
});
 
var unit_items = {};
 
var get_background_image_name = function($t){
 
    let unit_name = $t.attr('id');
    
    if(typeof unit_items[unit_name] === 'undefined'){
        let bg = $t.css('background-image');
        unit_items[unit_name] = editurlimg(bg);
        unit_items[unit_name][3] = true;
    }
    
    if(unit_items[unit_name][3]){
        $t.css('background-image', (unit_items[unit_name][0] + '/' + unit_items[unit_name][1] + '-active.' + unit_items[unit_name][2]));
        unit_items[unit_name][3] = false;
    }else{
        $t.css('background-image', (unit_items[unit_name][0] + '/' + unit_items[unit_name][1] + '.' + unit_items[unit_name][2]));
        unit_items[unit_name][3] = true;
    }
 
}
 
 
var editurlimg = function(str){ 
    let tmp_arr = str.split('/');
    let last_item = tmp_arr.pop();
    let last_item_arr = last_item.split('.'); 
    return [
        tmp_arr.join('/'),
        last_item_arr[0],
        last_item_arr[1],
    ];
}

colgol80 16.11.2021 11:19

Вложений: 1
что то здесь нужно подправить, добавить в цикле допустим вернуть все картинки, которые не "активны". я не сам писал этот код, поэтому есть кое где непонимание, но поидее править нужно в этом отрезке
var get_background_image_name = function($t){
 
    let unit_name = $t.attr('id');
    
    if(typeof unit_items[unit_name] === 'undefined'){
        let bg = $t.css('background-image');
        unit_items[unit_name] = editurlimg(bg);
        unit_items[unit_name][3] = true;
    }
    
    if(unit_items[unit_name][3]){
        $t.css('background-image', (unit_items[unit_name][0] + '/' + unit_items[unit_name][1] + '-active.' + unit_items[unit_name][2]));
        unit_items[unit_name][3] = false;
    }else{
        $t.css('background-image', (unit_items[unit_name][0] + '/' + unit_items[unit_name][1] + '.' + unit_items[unit_name][2]));
        unit_items[unit_name][3] = true;
    }
 
}


Часовой пояс GMT +3, время: 16:17.