Befehlsklick öffnet keinen neuen Tab, aber Mittelklick tut es

Wenn ich auf meiner Website, einer einseitigen JS-Site mit Sammy.js und jQuery, mit der mittleren Maustaste auf einen Link klicke, wird der Link in einem neuen Tab geöffnet. Aber wenn ich auf einem Mac mit der Befehlstaste klicke, tut es das nicht. Dies geschieht sowohl in Firefox als auch in Chrome, daher gehe ich davon aus, dass es in irgendeiner Weise den Spezifikationen entsprechen muss.

Dies geschieht auf einem Macbook Air (also Trackpad + Befehlstaste). Die meisten Websites funktionieren jedoch einwandfrei, wobei der Befehlsklick mit dem normalen Mittelklick identisch ist.

Probieren Sie es selbst aus: https://circleci.com. Klicken Sie bei gedrückter Befehlstaste zwischen „Info“, „Home“ und „Kontakt“ und Sie sollten das Problem feststellen – sie öffnen sich nicht in neuen Tabs.

Spekuliert hier, wird aber später von einem Mac bestätigt. Es wurde bestätigt, dass dies auf einem Mac funktioniert.

Win-Strg+Klick oder ein Mac-Befehl+Klick wird von einem “normalen” Klick-Listener aufgenommen, genau wie ein Klick mit jeder anderen Zusatztaste (Alt+Klick, Umschalt+Klick usw.).

Dies ist besonders verwirrend, da ein Strg+Klick auf einem Mac wird als Rechtsklick auf Betriebssystemebene interpretiert. Befehlsklick hingegen ist nicht wird als Mittelklick interpretiert, sondern ist eher eine Browsereinstellung.

Unter der Annahme, dass Sie keine In-Site-Funktionalität haben, die speziell auf geänderte Klicks angewiesen ist, wäre es angemessen, solche Ereignisse von Klick-Listenern auszuschließen und stattdessen zuzulassen, dass sie nativ vom Browser verarbeitet werden. Angesichts der Erfahrung von jemand in ähnlicher situationsollten Sie Folgendes zu Klick-Handlern hinzufügen können (wahrscheinlich ein Delegat auf Bibliotheksebene, wie von Brilliand angegeben):

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

Wenn am Anfang des Handlers mit hinzugefügt e sich auf ein aktuelles Klickereignis bezieht, sollte dies jegliches Folgen umgehen e.preventDefault();

Aktualisieren:

Es funktioniert tatsächlich! Im diese eher minimalistische Geigekann ich erkennen, wenn bei gedrückter Befehlstaste oder bei gedrückter Strg-Taste geklickt wurde, um zu vermeiden, dass der Rest des Klick-Handlers ausgeführt wird, einschließlich des Ajax-Abrufs des Inhalts und e.preventDefault();. Dadurch kann ein Befehlsklick auf einem Mac “wie beabsichtigt” behandelt werden, dh der Link wird in einem neuen Tab geöffnet.

Mit diesem Befund im Hinterkopf, diese Zeilen sollte jetzt lesen

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

Hier gibt es interessante Einblicke:
https://groups.google.com/forum/#!msg/mozilla.dev.usability/H1qLTur4EFc/gXH007CAPk8J

Anscheinend kann das von Ihnen verwendete JS preventDefault() cmd+Klick, während der Mittelklick unbeeinflusst bleibt. Konsultieren Sie die Dokumentation Ihres JS/Site-Frameworks.

Hier ist der relevante Code von 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;
    }
});

Zusammenfassung: Wenn jemand auf einen Link klickt, überschreiben Sie das standardmäßige Linkverhalten mit dem Verhalten von sammy.js, das darin besteht, die aktuelle Seite so zu ändern, dass der Inhalt der Zielseite ohne tatsächlichen Seitenladevorgang angezeigt wird. Laut Dakdads Link wird ein Befehlsklick (im Gegensatz zu einem Mittelklick) vom Click-Ereignis abgefangen und kann überschrieben werden.

Als Problemumgehung könnten Sie den Ereignishandler von sammy.js entfernen (mithilfe von $('a').die('click.history-' + _sammy_event_namespace_);) und ersetzen Sie sie durch eine modifizierte Version, die auf Befehlsklicks prüft und deren Überschreibung vermeidet.