Ändern der ID eines Elements mit jQuery

302

Ich muss die ID eines Elements mit jQuery ändern.

Anscheinend funktionieren diese nicht:

jQuery(this).prev("li").attr("id")="newid"
jQuery(this).prev("li")="newid"

Ich habe herausgefunden, dass ich es mit dem folgenden Code schaffen kann:

jQuery(this).prev("li")show(function() {
    this.id="newid";
});

Aber das scheint mir nicht richtig zu sein. Es muss einen besseren Weg geben, nein? Falls nicht, welche andere Methode kann ich anstelle von Ein- / Ausblenden oder anderen Effekten verwenden? Natürlich möchte ich das Element nicht jedes Mal ein- / ausblenden oder beeinflussen, nur um seine ID zu ändern.

(Ja, ich bin ein jQuery-Neuling.)

Bearbeiten
Ich kann in diesem Fall keine Klassen verwenden, ich muss IDs verwenden.

javascript jquery yoavf
quelle
5
In JavaScript können Sie einer Variablen ( foo = 1), einem Mitglied eines Objekts ( foo.bar = 2oder foo['bar'] = 2) oder einem Array-Index ( foo[0] = 3) zuweisen, aber einem Ausdruck wie dem Ergebnis eines Operators ( (x + b) = 5) oder dem Ergebnis eines Funktionsaufrufs ( foo() = 1, ) zuweisen foo(x).bar(y) = 7) macht keinen Sinn, daher wird es definitiv nicht so sein, wie es in jQuery oder einer anderen JavaScript-Bibliothek funktioniert.
Rakslice

Antworten:

521

Ihre Syntax ist falsch, Sie sollten den Wert als zweiten Parameter übergeben:

jQuery(this).prev("li").attr("id","newId");
Eran Galperin
quelle
4
Ich denke, newId sollte in Anführungszeichen stehen
Jay Corbett
5
Müssen Sie das Element nicht vom DOM trennen und durch ein neues Element mit einer neuen ID ersetzen? Um das DOM nicht zu beschädigen ...?
Cllpse
15
jQuery kümmert sich darum, Hahnsäure.
McPherrinM
15
hier angekommen doppelt überprüfen ID Neuzuweisung - sollte dies jetzt .prop( ... )statt sein .attr( ... )?
Carl
2
@Carl sollte nach den neuesten jquery-Dokumenten und -Beispielen idweiterhin mitattr(...)
JoeBrockhaus
71

Eine BEVORZUGTE OPTION .attrist .propwie folgt zu verwenden :

$(this).prev('li').prop('id', 'newId');

.attrRuft das Attribut des Elements ab, während .propdie Eigenschaft abgerufen wird, auf die das Attribut verweist (dh was Sie tatsächlich ändern möchten).

Jeremy Moritz
quelle
4
.attr ist veraltet - dies ist die richtige Vorgehensweise.
PointlessSpike
7
Woher kommen diese Informationen? api.jquery.com/attr sagt nichts über Abwertung ...
Sergej
Es ist nicht veraltet. " Ab jQuery 1.6 bietet die .prop()Methode eine Möglichkeit, Eigenschaftswerte explizit abzurufen und .attr()Attribute abzurufen."
Illuminator
@Illuminator Ich habe meine Antwort entsprechend korrigiert. Vielen Dank.
Jeremy Moritz
45

Was Sie tun wollen, ist:

jQuery(this).prev("li").attr("id", "newID");

Dadurch wird die ID auf die neue ID gesetzt

Pim Jäger
quelle
11

Ich habe etwas Ähnliches mit diesem Konstrukt gemacht

$('li').each(function(){
  if(this.id){
    this.id = this.id+"something";
  }
});
Petr Safar
quelle
7

Ich bin mir nicht sicher, was Ihr Ziel ist, aber könnte es besser sein, stattdessen addClass zu verwenden? Ich meine, eine Objekt-ID sollte meiner Meinung nach statisch und spezifisch für dieses Objekt sein. Wenn Sie nur versuchen, die Anzeige auf der Seite oder so etwas zu ändern, würde ich diese Details in eine Klasse einfügen und sie dann dem Objekt hinzufügen, anstatt zu versuchen, die ID zu ändern. Wiederum sage ich das, ohne Ihr unterstrichenes Ziel zu verstehen.

Tim Knight
quelle
3
die Freuden älterer Systeme - ich verstehe dann Ihren Schmerz. Eran Antwort ist dann definitiv die beste.
Tim Knight
5
Das Festlegen der ID ist nützlich und sinnvoll, wenn Sie das DOM erstellen, indem Sie versteckte Vorlagen im HTML-Code verwenden und diese dann mit jquery klonen.
Steve Knight
5 
$("#LeNomDeMaBaliseID").prop('id', 'LeNouveauNomDeMaBaliseID');
Sébastien
quelle
1
Diese Lösung wurde bereits hier zur Verfügung gestellt
Cristik
1
Bitte posten Sie keine Nur-Code-Antworten - fügen Sie Ihrem Code in der Antwort immer eine Erklärung hinzu.
Daniel W.
2 
<script>
       $(document).ready(function () {
           $('select').attr("id", "newId"); //direct descendant of a
       });
</script>

Dies könnte für alle Zwecke tun. Fügen Sie einfach vor Ihrem Body Closing Tag hinzu und dürfen Sie Jquery.min.js nicht hinzufügen

Prassanna D Manikandan
quelle
0

Erans Antwort ist gut, aber ich würde das anhängen. Sie müssen jede Interaktivität beobachten, die nicht inline zum Objekt ist (dh wenn ein Onclick-Ereignis eine Funktion aufruft, wird dies immer noch der Fall sein). Wenn dieser ID jedoch eine Javascript- oder jQuery-Ereignisbehandlung zugeordnet ist, wird sie grundsätzlich abgebrochen ::

$("#myId").on("click", function() {});

Wenn die ID jetzt in # myID123 geändert wird, funktioniert die oben angehängte Funktion meiner Erfahrung nach nicht mehr richtig.

rfornal
quelle