Question

我正在尝试从localStorage中删除一个项目。当用户单击删除按钮时，我需要检查localStorage中包含的内容，并根据删除的行删除该值。

例如，假设localStorage包含以下逗号分隔列表：

contact,user,account

如果删除的行是account行，那么我需要从列表中删除帐户值，以便localStorage现在包含：

contact,user

或者，如果删除的行是user行，那么我需要从列表中删除用户值，以便localStorage现在包含：

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]);
                });
            }
        });

感谢任何帮助。感谢。

Answer 1

将值拆分为数组，找到要删除的值，并将其从数组中拼接出来：

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(',');

从localStorage中删除项目

1 个答案: