Deaktivieren Sie einen Href-Link in PHP-Javascript
-
02-01-2020 - |
Frage
Ich habe 4 Links auf meiner Seite (.phtml-Datei) wie folgt
<ul id="fileMenu" class="contextMenu">
<li class="add"><a id ="addbtn" href="#add" style="display:none;">Add</a></li>
<li class="download"><a href="#download">Download</a></li>
<li class="rename"><a href="#rename">Rename</a></li>
<li class="del"><a href="#delete">Delete</a></li>
<li class="copypath"><a href="#copypath">Copypath</a></li>
</ul>
Ich möchte die Links zum Hinzufügen, Umbenennen und Löschen deaktivierenDeaktivieren Sie es einfach über die Benutzeroberfläche .
Der Benutzer sollte es sehen können, aber es sollte kein Klickereignis ausgeführt werden (Links sollten ausgegraut sein).
Ich habe benutzt
disable="disabled"
display =none;
aber sie erfüllen nicht ihren Zweck.
Gibt es eine andere Möglichkeit, wie das klappen würde?
Lösung
Ich würde dieses CSS verwenden, um einen Link visuell zu deaktivieren:
.disable {
position: relative;
}
.disable:before {
content: '';
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
z-index: 100;
}
.disable a {
color: gray;
cursor: default;
}
Um dann einen Link zu deaktivieren, würden Sie eine Klasse einfügen disable
auf entsprechende li
:
<li class="download disable"><a href="#download">Download</a></li>
Im Grunde wird ein Link mit einem transparenten Pseudoelement überlagert :before
.
Eine andere Lösung könnte sein pointer-events: none
Regel, aber sie wird im IE nicht gut unterstützt.
Demo: http://jsfiddle.net/LPz2Z/1/
Andere Tipps
Wenn Sie JQuery verwenden, möchten Sie dies möglicherweise tun
generasacodicetagpre.Ich bin nicht sicher, ob es der beste Weg ist, aber es kann den Trick tun,
wenn Sie verwenden
generasacodicetagpre.oder wenn Sie es von Javascript anrufen möchten:
generasacodicetagpre.an deaktivierte Interaktion mit Ihren Benutzern.
Zeiger-Ereignisse verwenden: Keine;
generasacodicetagpre.Es gibt ein paar Optionen.Mit einfachem altem Javascript können Sie zum Beispiel:
generasacodicetagpre.oder
generasacodicetagpre.Mit jQuery können Sie problemlos viele Links deaktivieren:
generasacodicetagpre.und Sie können sogar CSS verwenden!
generasacodicetagpre.Obwohl es Sie nicht überraschen würde, dh <= v9 (wenn ich richtig bin), unterstützt dies nicht ... und auf den meisten Browsern können Sie den Browser nicht zwingen, einen Zeiger als Cursor zu verwenden...
selbst dies diente dem Zweck
generasacodicetagpre.Da verwende ich ContextMenu-Klasse in meiner UL-Liste.