Open JSON links into new browser tabs?-CodePudding

thanks ahead of time for your help... I'm relatively new to coding (especially JSON/JavaScript/jQuery) so forgive my imprecise terminologies and references.

I have a JSON/JavaScript enabled footer with the relevant JSON code below:

    footerOptions : {
        'Old Website' : 'http://Link1.com',
        'Illustration Site' : 'https://Link2.com',
        'Blog Site' : '/'

The footerOptions variable is referenced in this backend JS code:

    var footerOptions = $('<div>', { id : 'ctd-footer-options' });
    footerOptions.css({
        position : 'relative',
        zIndex : 100,
        padding : '30px 10px 30px 0'
    });
    footerOptions.css(config.footerMenuOptionsStyle);
    footerOptions.css({ backGroundColor : 'transparent' });
    var footerOptionsHtml = '';
    config.footerOptions[''] = '';
    Object.keys(config.footerOptions).forEach((key, i) => {
        var target = "window.location.href=\'" config.footerOptions[key] "\'";
        if (key.substring(1,4) == 'svg' || key.substring(1,4) == 'SVG') {
            target = "window.open(\'" config.footerOptions[key] "\', \'_blank\')";
        }
        footerOptionsHtml = footerOptionsHtml '<div  onclick="' target '" style="cursor:pointer; float:left; margin-right:30px;">' key '</div>';
    });
    footerOptions.html(footerOptionsHtml);
    footerContent.append(footerOptions);

... My goal is to have the JSON links ('Old Website', 'Illustration Site', etc.) open themselves in new browser tabs. What would be the most efficient way to tweak the above code towards that goal?

Again, thanks very much to any and all contributors!

Charles

I tried plugging in the below code around the ' target ':

onclick="window.open(this.href); return false;" onkeypress="window.open(this.href); return false;"

...to no avail. The links opens in the same tab alongside a blank tab.

CodePudding user response：

IMHO

why not construct the links instead on onclick

footerOptionsHtml  = "<a href='" config.footerOptions[key] "' target='_blank'>" key "</a>"

CodePudding user response：

Jay Swaminarayan!

Yes why not?

footerOptionsHtml  = "<a class='ctd-footer-option' href='" config.footerOptions[key] "' target='_blank'>" key "</a>"