Entfernen oder deaktivieren Sie den Fokusrand des Browsers über Javascript

Weiß jemand, wie man den (in den meisten Browsern) gestrichelten Rand eines Dom-Elements deaktiviert oder manipuliert, wenn es den Fokus in einer Tabindex-Reihenfolge hat?

Ich möchte meinen eigenen Stil für ein fokussiertes Element erstellen, aber es wäre großartig, die vorhandene Funktion zu verwenden, da es mit tabindex möglich ist, das Keydown-Ereignis an das dom-Element zu binden.

Erstellen Sie einfach eine CSS-Regel für die gewünschten Elemente outline:none;

CSS-Trick:

:focus { outline: none; }

Wenn ich in Firefox 53.0 die Gliederung mit einer der vorgeschlagenen Lösungen deaktiviere, zeigt Firefox die Standardlösung an.

Wenn ich jedoch eine leere Farbe verwende, wird nicht erkannt, dass der Umriss ausgeblendet ist:

input:focus{
   outline: 1px solid rgba(255,255,255,1);
}

input::-moz-focus-inner { border: 0; }

a {
outline: 0;
}

a: hover,
a: active,
a: focus {
     outline: none;
}

input::-moz-focus-inner {
border: 0;
}

:focus state- Setzen Sie die Gliederungseigenschaft auf 0px solid transparent.

$(function() {
     $('a').click(function() { $(this).blur(); });
     $('input').click(function() { $(this).blur(); });
});

Verwenden Sie keinen CSS-Deaktivierungsfokus: http://outlinenone.com/ Verwenden Sie andere Benutzer.

Mit jQuery können Sie dies tun

$("#nav li a").focus(function(){
  $(this).blur();
});