根据点击事件修改网址

Question

I have a series of divs that when clicked it slides up basically a modal. The modal has a data-attribute that appears in the url. The issue I'm having is when I close the modal, the url still has the data-attribute hash, it doesn't revert back and I need it to.

This is the js:

$('[data-agent]').click(function() {
        var element = $(this);
        var target = element.data('agent');
        $('body').addClass('agentLoaded');
        $('[data-agent-target]').not('[data-agent-target="'+target+'"]').removeClass('active');
        $('[data-agent-target="'+target+'"]').addClass('active');
        window.location.hash = 'agent='+target;
        return false;
    });

    if(document.location.hash){
        var hash = document.location.hash.split('#')[1];
        hash = hash.replace('agent=', '');
        if(hash && $('[data-agent-target="'+hash+'"]').length) {
            $('[data-agent="'+hash+'"]').trigger('click');
        }
    }

    $('.close').click(function() {
        $('[data-agent-target]').removeClass('active');
        $('body').removeClass('agentLoaded');
        return false;
    });

Answer 1

[edit] Please see the question in the code

$('[data-agent]').click(function() {
    var element = $(this);
    var target = element.data('agent');
    $('body').addClass('agentLoaded');
    $('[data-agent-target]').not('[data-agent-target="'+target+'"]').removeClass('active');
    $('[data-agent-target="'+target+'"]').addClass('active');
    window.location.hash = 'agent='+target;
    return false;
});

if(document.location.hash){ /* What is this for ? */
    var hash = document.location.hash.split('#')[1];
    hash = hash.replace('agent=', '');
    if(hash && $('[data-agent-target="'+hash+'"]').length) {
        $('[data-agent="'+hash+'"]').trigger('click');
    }
}

$('.close').click(function() {
    $('[data-agent-target]').removeClass('active');
    $('body').removeClass('agentLoaded');
    return false;
});