how to loop through array of objects and get the value and add click event to the value

Question

I've got this code and it works perfectly, but what I want is to add the classes to an array and loop through them and get the value, and whenever a class (that is inside the array I looped) is clicked I'll add the click event it will call a function to do something (scroll to the clicked class).

My old code without the array:

$(
    'header .navbar-nav > li > a,'
    +'.services .arrow > .arrowDown,'
    +'.alert a,'
    +'.incorrect-page .message p a'
).click(function () {              
    var data_value = $(this).data('value');

    // check if data_value exist in the current page
    if ($('#' + data_value).length) {
        if (data_value === 'home') {
            // if it's home, load homepage
            document.location.href = "/kazamizaNEW/";
            // alert("/kazamizaNEW/index?page=1")
        } else {
            // smooth scroll to that element
            $('html').animate({
                scrollTop: $('#' + data_value).offset().top
            }, 500);
        }
    }  else {
        // else do this:
        document.location.href = "/kazamizaNEW/#" + data_value;
    }
});

What I tried to do and failed:

var smoothScrollElements = {
    'headerNav': 'header .navbar-nav > li > a,',
    'serScroll': '.services .arrow > .arrowDown,',
    'alertLink': '.alert a,',
    'incorLink': '.incorrect-page .message p a'
};

var keys = $.map(smoothScrollElements, function (scrollLink, key) {
    // Loop for each Element in the array
    $(scrollLink).each(function (element, index) {
        element.click(function() {
            console.log("the class you clicked: " + element + "!");
        });
    });
});

I hope that I explained what I want. Thanks a lot.

N'Bayramberdiyev · Accepted Answer · 2019-11-30 09:54:21Z

1

smoothScrollElements is invalid. Remove commas at the end of the string. And each() is unnecessary in your $.map() function.

var keys = $.map(smoothScrollElements, function (scrollLink, key) {
    $(scrollLink).click(function() {
        console.log("the class you clicked: " + scrollLink + "!");
    });
});

answered Nov 30, 2019 at 9:54

N'Bayramberdiyev

3,6509 gold badges32 silver badges47 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

how to loop through array of objects and get the value and add click event to the value

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related