Home Run
Ich habe HTML wie folgt:
<span class="file-wrapper" id="fileSpan">
<input type="file" name="photo[]" id="photo" />
<span class="button">Click to choose photo</span>
</span>
Ich möchte das Eingabefeld von dort extrahieren, seine ID ändern und es in ein anderes div einfügen.
Wie kann ich das machen? Wenn jQuery benötigt wird, ist das in Ordnung, aber wenn es ohne geht, wäre es großartig.
Andi E
Es ist sicherlich einfach in jQuery:
// jQuery 1.6+
$("#photo").prop("id", "newId").appendTo("#someOtherDiv");
// jQuery (all versions)
$("#photo").attr("id", "newId").appendTo("#someOtherDiv");
Arbeitsdemo: http://jsfiddle.net/AndyE/a93Az/
Wenn Sie es im einfachen alten JS tun möchten, ist es immer noch ziemlich einfach:
var photo = document.getElementById("photo");
photo.id = "newId";
document.getElementById("someOtherDiv").appendChild(photo);
Arbeitsdemo: http://jsfiddle.net/AndyE/a93Az/1/
@Royi: problemlos auf ältere Versionen portierbar, einfach ändern prop() zu attr().
– Andi E
26. September 2011 um 13:03 Uhr
Sollten wir uns nicht sowieso für die neueste Version von jQuery entscheiden, wenn dies möglich ist?
– Dan Lugg
26. September 2011 um 13:04 Uhr
@Bracketworks: Das würde ich sagen. IIRC, prop() sollte etwas effizienter sein als attr() da weniger Arbeit in Bezug auf die Kompatibilität zu erledigen ist.
– Andi E
26. September 2011 um 13:09 Uhr
Es lohnt sich, das zu erklären, wenn Sie es verwenden appendChild (oder append oder appendTo) mit einem vorhandenen DOM-Element wird dieses Element an die neue Position verschoben und nicht dorthin kopiert.
– Brandstifter
26. September 2011 um 13:14 Uhr
@mblase75: vielleicht, aber ist das nicht ziemlich erklärend, wenn man den Code liest oder testet? Auf jeden Fall sollten die funktionierenden Demos jede Verwirrung beseitigen 🙂
– Andi E
26. September 2011 um 13:25 Uhr
