HTML-Element schreibbar machen

Gast #3865794
Lesenswert?
• ▲
▼
Hallo,

ich möchte für ein Projekt eine HTML-Element (nicht <input> oder 
<textarea>) schreibbar machen d.h. man macht einen dblclick auf das 
Element und man soll den Text-Inhalt bearbeiten können. Nach einem Klick 
neben das Element soll der neue Text darin bleiben. Wie geht das?
1
<div style="border:1px solid black;">Inhalt</div>

--------
|Inhalt|
--------

Danach z.B.

--------
|Hallo!|
--------
Gast #3865805
Lesenswert?
• ▲
▼
Mit javascript ist es dann einfach umsetzbar z.B. in dem man dem div 
eine id gibt und dann mit 
getElementById('id').style.contenteditable=true es umstellt. Noch 
einfacher ist es mit:
<div ondblclick="this.style.contenteditable=true;">Inhalt</div>
Gast #3866390
Lesenswert?
• ▲
▼
Ich glaube, um dies zu verstehen, mus ich den ganzen Code zeigen.
Bei Click auf einen der A's wird ein div geschrieben. Bei dblclick 
verändert sich die opacity auf 0. Im div ist ein Element schreibbar und 
ein Bild vorhanden. Bei Click auf den div mit drehen soll sich der ganze 
Außen-div mit den Innen-divs drehen. Die Funktion startDrag() ist für 
das verschieben mit der Maus zuständig.
Angehängte Dateien:
Gast #3866526
Lesenswert?
• ▲
▼
function fuegehinzu(text,beschreibung){
 document.getElementById("content").innerHTML+='<div 
style="position:absolute; max-width:200px; max-height:200px; 
padding:7px; top:300 px; left:100px;" onclick=\'var element = 
this;element.classList.add("gedreht");\'ondblclick="this.style.opacity=0 
;"  onmousedown="startDrag(this);"><img alt="'+beschreibung+'" 
src="'+text+'"/><div contenteditable="true">'+beschreibung+' 
</div><div>Drehen</div></div>';
}

Die Lösung! Jetzt wir bei click auf das ganze Element gedreht. Es soll 
aber, wenn auf drehen geclickt wird, das Element gedreht werden.

Antwort schreiben

Bitte melde dich an, um einen Beitrag zu schreiben.

oder

Mit Google-Account einloggen

Die Registrierung ist kostenlos und dauert nur eine Minute.

Jetzt registrieren