удалить элемент из локального хранилища

Question

удалить элемент из локального хранилища

0

Я пытаюсь удалить элемент из localStorage. Когда пользователь нажимает кнопку удаления, мне нужно проверить, что содержится в localStorage, и удалить значение на основе строки, которая была удалена.

Например, скажем, localStorage содержит следующий список с разделителями-запятыми:

contact,user,account

Если строка, которая была удалена, была строкой account, тогда мне нужно удалить значение учетной записи из списка, чтобы теперь локальная хранилища содержала:

contact,user

Или, если строка, которая была удалена, была строкой user, тогда мне нужно удалить значение пользователя из списка, чтобы теперь он был локальным хранилищем:

contact,account

Вот мой код jquery:

<script type="text/javascript"> 
    var j$ = jQuery.noConflict();

    j$(document).ready(function() {
        var dataRows = j$('tr.dataRow');
        localStorage.activeButtons = '';          
        var active = localStorage.activeButtons.split(',');          
        dataRows.each(function(index, elem) {
            updateImages(elem, active[index]);
        });

        j$("img[id$=':deleteImage']").on("click", function(event) {
            updateImages(j$(this).closest('tr'));
        });

        j$('[id$=btnContact]').on('click', function() {
            localStorage.activeButtons += 'contact,';
        });

        j$('[id$=btnUser]').on('click', function() {
            localStorage.activeButtons += 'user,';
        });

        j$('[id$=btnAccount]').on('click', function() {
            localStorage.activeButtons += 'account,';
        });

        A4J.AJAX.AddListener({
            onafterajax: function(req,evt,data) {  

                console.log('************* activeButtons = ' + localStorage.activeButtons);
                j$('[id$=deleteImage]').on('click', function(elem) {
                    console.log('the delete button was clicked');
                    console.log(elem);
                    console.log('************** before ' + localStorage.activeButtons);
                    localStorage.activeButtons = localStorage.activeButtons;
                    console.log('************** after ' + localStorage.activeButtons);
                });
                console.log('************* activeButtons = ' + localStorage.activeButtons);

                var lastRow = j$('table[id$=participantTable] tbody tr:last');                 
                var active = localStorage.activeButtons.split(',');

                var dataRows = j$('tr.dataRow');
                dataRows.each(function(index, elem) {
                    updateImages(elem, active[index]);
                });
            }
        });   

    });

    function updateImages(myRow, myActive) { 
        var rowInputs =  j$(myRow).find('input[type="text"]');
        var contactId = (j$(rowInputs[0]).attr('id'));
        var userId = (j$(rowInputs[1]).attr('id'));
        var accountId = (j$(rowInputs[2]).attr('id'));
        var contact = (j$(rowInputs[0]).val()); 
        var user = (j$(rowInputs[1]).val());
        var account = (j$(rowInputs[2]).val());

        if(contactId.indexOf("participant") != -1 || userId.indexOf("participant") != -1 || accountId.indexOf("participant") != -1) {
            switch (myActive) {
                case "contact":
                    // hide the other two
                    j$(rowInputs[1]).hide();
                    j$(rowInputs[2]).hide();
                    j$(rowInputs[1].parentNode).find('img').hide();
                    j$(rowInputs[2].parentNode).find('img').hide();
                    break;
                case "user":
                    // hide the other two
                    j$(rowInputs[0]).hide();
                    j$(rowInputs[2]).hide();
                    j$(rowInputs[0].parentNode).find('img').hide();
                    j$(rowInputs[2].parentNode).find('img').hide();
                    break;
                case "account":
                    // hide the other two
                    j$(rowInputs[0]).hide();
                    j$(rowInputs[1]).hide();
                    j$(rowInputs[0].parentNode).find('img').hide();
                    j$(rowInputs[1].parentNode).find('img').hide();
                    break;
            }
            if (contact !== '') {
                j$(rowInputs[1]).hide();
                j$(rowInputs[2]).hide();
                j$(rowInputs[0].parentNode).find('img').show();
                j$(rowInputs[1].parentNode).find('img').hide();
                j$(rowInputs[2].parentNode).find('img').hide();
            }    
            else if (user !== '') {
                j$(rowInputs[0]).hide();
                j$(rowInputs[2]).hide();
                j$(rowInputs[0].parentNode).find('img').hide();
                j$(rowInputs[1].parentNode).find('img').show();
                j$(rowInputs[2].parentNode).find('img').hide();
            }
            else if (account !== '') {
                j$(rowInputs[0]).hide();
                j$(rowInputs[1]).hide();
                j$(rowInputs[0].parentNode).find('img').hide();
                j$(rowInputs[1].parentNode).find('img').hide();
                j$(rowInputs[2].parentNode).find('img').show();
            }
            if (account !== '' && contact !== '') {
                j$(rowInputs[1]).hide();
                j$(rowInputs[2]).show();
                j$(rowInputs[0].parentNode).find('img').show();
                j$(rowInputs[1].parentNode).find('img').hide();
                j$(rowInputs[2].parentNode).find('img').hide();
            }
        }
    }
</script>

Вот соответствующая часть кода, которую я пытаюсь удалить из localStorage:

        A4J.AJAX.AddListener({
            onafterajax: function(req,evt,data) {  

                console.log('************* activeButtons = ' + localStorage.activeButtons);
                j$('[id$=deleteImage]').on('click', function(elem) {
                    console.log('the delete button was clicked');
                    console.log(elem);
                    console.log('************** before ' + localStorage.activeButtons);
                    //here is where I need to remove the value from the localStorage
                          //I am passing in the elem as the function argument to determine
                          //what row is being deleted and what value I should remove from the 
                          //local storage.
                    console.log('************** after ' + localStorage.activeButtons);
                });
                console.log('************* activeButtons = ' + localStorage.activeButtons);

                var lastRow = j$('table[id$=participantTable] tbody tr:last');                 
                var active = localStorage.activeButtons.split(',');

                var dataRows = j$('tr.dataRow');
                dataRows.each(function(index, elem) {
                    updateImages(elem, active[index]);
                });
            }
        });

Любая помощь приветствуется. Благодарю.

Dman100 24 сен. 2013, в 19:24

Источник

Теги:

jquery

1 ответ

Ещё вопросы

Jason P · Accepted Answer · 2013-09-24T15-19-00.000Z

Разделите значения в массиве, найдите значение, которое хотите удалить, и соедините его с массивом:

var activeArray  = localStorage.activeButtons.split(',');
var idx = activeArray.indexOf(elem); // not sure what elem is, but this should be the value you want to remove

if (idx > -1)
    activeArray.splice(idx, 1);

localStorage.activeButtons = activeArray.join(',');