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

  1. disable="disabled"

  2. display =none;

aber sie erfüllen nicht ihren Zweck.

Gibt es eine andere Möglichkeit, wie das klappen würde?

War es hilfreich?

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.

Weitere Informationen, Stackoverflow-Frage

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...

alle in einer Geige Demo!

selbst dies diente dem Zweck

generasacodicetagpre.

Da verwende ich ContextMenu-Klasse in meiner UL-Liste.

Lizenziert unter: CC-BY-SA mit Zuschreibung
Nicht verbunden mit StackOverflow
scroll top