Командный щелчок не открывает новую вкладку, но выполняется средний щелчок

На моем веб-сайте, который является одностраничным JS-сайтом с использованием Sammy.js и jQuery, когда я нажимаю среднюю ссылку на мышь, ссылка открывается на новой вкладке. Но когда я нажимаю на Mac, это не так. Это происходит как в Firefox, так и в Chrome, поэтому я предполагаю, что это должно быть согласно спецификации в некотором роде.

Это происходит на Macbook Air (так что кнопка trackpad + command). Большинство сайтов работают нормально, но при этом щелчок команды идентичен среднему среднему щелчку.

Попробуйте сами: https://circleci.com. Командный щелчок между "about", "home" и "contact", и вы должны столкнуться с проблемой - они не открываются на новых вкладках.

Ответы

Ответ 1

~~Спекуляция здесь, но будет подтверждена позже с Mac.~~ Это подтверждено, что работает на Mac.

Win ctrl + click или команда Mac + клик получает "обычный" прослушиватель кликов, как щелчок с любым другим ключом-модификатором (alt + click, shift + click и т.д.).

Это особенно сбивает с толку, так как ctrl + click на Mac интерпретируется как щелчок правой кнопкой мыши по уровню ОС. С другой стороны, командный клик не интерпретируется как средний клик, а скорее предпочтение браузера.

Предполагая, что у вас нет функциональных возможностей на сайте, которые специально полагаются на измененные клики, было бы целесообразно исключить такие события из прослушивателей кликов, а вместо этого позволить им пузыриться, чтобы они были обработаны браузером. Учитывая опыт кого-то в подобной ситуации, вы должны иметь возможность добавить следующие обработчики кликов (вероятно, делегат на уровне библиотеки, как указано Бриллиандом):

if (e.metaKey || e.ctrlKey) return;

При добавлении в начале обработчика с e, ссылающегося на текущее событие click, это должно обойти любые следующие e.preventDefault();

Обновление:

Это действительно работает! В эта довольно минималистическая скрипка, я могу распознать, когда нажата команда или нажата клавиша управления, чтобы избежать выполнения остальной части обработчика кликов который включает ajax-выборку содержимого и e.preventDefault();. Это позволяет обрабатывать команды "по назначению" на Mac, т.е. Открывать ссылку на новой вкладке.

С учетом этого вывода эти строки теперь должны читать

if (e.isDefaultPrevented() || e.metaKey || e.ctrlKey) {
    return;
}

Ответ 2

Здесь есть интересное понимание: https://groups.google.com/forum/#!msg/mozilla.dev.usability/H1qLTur4EFc/gXH007CAPk8J

Очевидно, что JS, который вы используете, может preventDefault() щелкнуть cmd +, пока средний клик не затронут. Обратитесь к документам вашей инфраструктуры JS/Site.

Ответ 3

Здесь соответствующий код от sammy.js:

// bind to link clicks that have routes
$('a').live('click.history-' + this.app.eventNamespace(), function(e) {
    if (e.isDefaultPrevented()) {
        return;
    }
    var full_path = lp.fullPath(this);
    if (this.hostname == window.location.hostname && app.lookupRoute('get', full_path)) {
        e.preventDefault();
        proxy.setLocation(full_path);
        return false;
    }
});

Сводка. Если кто-то нажимает на ссылку, переопределите стандартное поведение ссылки с поведением sammy.js, чтобы изменить текущую страницу, чтобы отобразить содержимое целевой страницы без фактической загрузки страницы. Согласно ссылке dakdad, щелчок команды (в отличие от среднего щелчка) улавливается событием клика и может быть переопределен.

Для обходного пути вы можете удалить обработчик событий sammy.js(используя $('a').die('click.history-' + _sammy_event_namespace_);) и заменить его модифицированной версией, которая проверяет щелчки и избегает их переопределения.