Ich ändere CSS mit jQuery und möchte das von mir hinzugefügte Styling basierend auf dem Eingabewert entfernen:
if(color != '000000') $("body").css("background-color", color); else // remove style ?
Wie kann ich das machen?
Beachten Sie, dass die obige Linie immer dann ausgeführt wird, wenn eine Farbe mit einem Farbwähler ausgewählt wird (dh wenn sich die Maus über ein Farbrad bewegt).
2. Hinweis: Ich kann dies nicht tun, css("background-color", "none")
da dadurch das Standard-Styling aus den CSS- Dateien entfernt wird.
Ich möchte nur den background-color
von jQuery hinzugefügten Inline-Stil entfernen .
javascript
jquery
css
background
Alex
quelle
quelle
Antworten:
Das Ändern der Eigenschaft in eine leere Zeichenfolge scheint die Aufgabe zu erledigen:
quelle
Die akzeptierte Antwort funktioniert, hinterlässt jedoch
style
in meinen Tests ein leeres Attribut im DOM. Keine große Sache, aber das entfernt alles:Dies setzt voraus, dass Sie alle dynamischen Stile entfernen und zum Stylesheet-Stil zurückkehren möchten.
quelle
Es gibt verschiedene Möglichkeiten, eine CSS-Eigenschaft mit jQuery zu entfernen:
1. Setzen Sie die CSS-Eigenschaft auf ihren Standardwert (Anfangswert)
Siehe den Anfangswert für die CSS-Eigenschaft bei MDN . Hier ist der Standardwert
transparent
. Sie könneninherit
das Attribut auch für mehrere CSS-Eigenschaften von seinem übergeordneten Element erben. In CSS3 / CSS4 können Sie auch verwendeninitial
,revert
oderunset
diese Schlüsselwörter haben möglicherweise eine eingeschränkte Browserunterstützung.2. Entfernen der CSS-Eigenschaft
Eine leere Zeichenfolge entfernt die CSS-Eigenschaft, d. H.
Beachten Sie jedoch, wie in der Dokumentation zu jQuery .css () angegeben , dass dies die Eigenschaft entfernt, jedoch Kompatibilitätsprobleme mit IE8 für bestimmte CSS-Kurzschrift-Eigenschaften, einschließlich Hintergrund, aufweist .
3. Entfernen des gesamten Stils des Elements
quelle
Ich habe die Möglichkeit, ein Stilattribut mit reinem JavaScript zu entfernen, um Sie über den Weg von reinem JavaScript zu informieren
quelle
Dadurch wird das vollständige Tag entfernt:
quelle
Jede dieser jQuery-Funktionen sollte funktionieren:
quelle
var cssObject = $('selector').prop('style'); cssObject.removeProperty('background-color');
Nur mit:
oder
quelle
Wie wäre es mit so etwas wie:
quelle
Benutze mein Plugin:
Verwenden Sie es für Ihren Fall wie folgt:
oder
Wenn Sie auch CSS entfernen möchten, das in seinen Klassen definiert ist:
quelle
$(this).removeAttr
ist redundant undthis.removeAttr
sollte ausreichen.removeAttr
entfernt auchclass
attr? Ich glaube nichtremoveAttr
Innere Ihres Plugins, wothis
sich bereits ein jQuery-Element befindet.$(this)
ist redundant.this
alsHTMLElement
Instanz bereit, die dem jQuery-Element zugeordnet ist ... Wie Sie sehen, ist meine Antwort alt ... deshalb ... kann ich Ihnen trotzdem sagen, warum sie das ändern, sie tun das wegen der Pfeilfunktion, die in ES6 neu ist. .. undthis
wird nutzlos und es wurde ersetzt durchevent.currentTarget
Versuche dies:
Vielen Dank
quelle
Wenn Sie den CSS-Stil verwenden, können Sie Folgendes verwenden:
und dann ersetzen durch:
Wenn Sie keinen CSS-Stil verwenden und ein Attribut im HTML-Element haben, können Sie Folgendes verwenden:
quelle
2018
Dafür gibt es eine native API
quelle
Dieser funktioniert auch !!
quelle
Warum nicht den Stil festlegen, mit dem Sie eine CSS-Klasse entfernen möchten? Jetzt können Sie verwenden :
.removeClass()
. Dies eröffnet auch die Möglichkeit:.toggleClass()
(Entfernen Sie die Klasse, falls vorhanden, und fügen Sie sie hinzu, wenn sie nicht vorhanden ist.)
Das Hinzufügen / Entfernen einer Klasse ist auch weniger verwirrend beim Ändern / Beheben von Problemen bei Layoutproblemen (im Gegensatz zum Versuch herauszufinden, warum ein bestimmter Stil verschwunden ist).
quelle
quelle
Dies ist komplexer als einige andere Lösungen, bietet jedoch möglicherweise mehr Flexibilität in Szenarien:
1) Erstellen Sie eine Klassendefinition, um das Styling, das Sie selektiv anwenden / entfernen möchten, zu isolieren (zu kapseln). Es kann leer sein (und sollte es in diesem Fall wahrscheinlich sein):
2) Verwenden Sie diesen Code basierend auf http://jsfiddle.net/kdp5V/167/ aus dieser Antwort von gilly3 :
Anwendungsbeispiel: http://jsfiddle.net/qvkwhtow/
Vorsichtsmaßnahmen:
Bei CSS geht es darum, das Styling auf diese Weise zu isolieren, auch wenn dies nicht der Fall ist. Das Manipulieren von CSS-Regeln ist NICHT das, worum es bei jQuery geht. JQuery manipuliert DOM-Elemente und verwendet dazu CSS-Selektoren.
quelle
Einfach ist billig in der Webentwicklung. Ich empfehle, beim Entfernen eines bestimmten Stils eine leere Zeichenfolge zu verwenden
quelle
Versuche dies
quelle