Как определить, пытается ли пользователь открыть ссылку на новой вкладке?

Я пишу веб-сайт, на котором весь контент хранится в среде JavaScript, поэтому должно быть возможно перемещаться между "страницами" без дополнительных HTTP-запросов.

Я хочу сохранить намерение пользователя в отношении того, как открываются ссылки. Например, если пользователь Mac Mac + щелкнул ссылку, он должен быть открыт на новой вкладке. Но если пользователь хочет открыть ссылку в текущем окне, я хочу избежать создания нового HTTP-запроса и просто использовать DOM-манипуляцию, чтобы показать новое содержимое.

Вот что я пробовал (JSFiddle):

<a href="#" onclick="location.href='http://yahoo.com'; return false;" id="mylink">Yahoo!</a>

document.getElementById("mylink").onclick = function() {
    alert("clicked");
    return false;
}

Он ведет себя по желанию для обычных левых кликов и для действий контекстного меню, но не для кликов с помощью ключа-модификатора. Я могу проверить, сохранены ли определенные ключи модификатора, но это кажется хрупким.

Сайт Twitter имеет поведение, подобное тому, что я хочу - когда вы нажимаете имя пользователя, обычно это запрос AJAX, но если вы нажмете с сохраненным мета-ключом, вы получите новую вкладку.

Я бы предпочел простое решение JavaScript без библиотек, если для этого не требуется куча логики, специфичной для платформы.

Update

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

$(document).on("click", ".js-directory-link", function (t) {
    return 2 === t.which || t.metaKey || t.ctrlKey ? void 0 : ($(this).closest("tr").addClass("is-loading"), $(document.body).addClass("disables-context-loader"))
}

Ответы

Ответ 1

Вы можете изучить свойства ctrlKey, shiftKey и metaKey объекта события. Если значение true, клавиша управления ключами, сменой или мета (клавиша Apple) удерживается, и вы должны разрешить действие ссылки по умолчанию. В противном случае вы можете использовать preventDefault, чтобы остановить действие ссылки и обработать его с помощью javascript.

Добавьте target="_blank" к вашей привязке привязки, поэтому по умолчанию ссылка на ссылку открывает новую вкладку. В противном случае он откроется поверх текущей страницы (что может быть желательно).

Здесь javascript, в любом случае:

document.getElementById("mylink").onclick = function(evnt) {
    if (
        evnt.ctrlKey || 
        evnt.shiftKey || 
        evnt.metaKey || // apple
        (evnt.button && evnt.button == 1) // middle click, >IE9 + everyone else
    ){
        return;
    }
    evnt.preventDefault();

    alert("clicked");
    return false;
}

Fiddle: http://jsfiddle.net/6byrt0wu/

Documentation