Verhindern, dass Inhalte hinzugefügt werden können & lt; div & gt; bei ENTER - Chrome
Ich habe eine contenteditable
element, und immer, wenn ich geben Sie ein paar Sachen und Treffer ENTER
es schafft eine neue <div>
und Orte, die neue Linie von text in es. Ich weiß nicht, wie diese ein wenig.
Ist es möglich, dies zu verhindern oder zumindest ersetzen Sie es mit einem <br>
?
Hier ist demo http://jsfiddle.net/jDvau/
Hinweis: Dies ist nicht ein Problem in firefox.
InformationsquelleAutor der Frage iConnor | 2013-08-31
Du musst angemeldet sein, um einen Kommentar abzugeben.
Versuchen, diese
Demo Hier
InformationsquelleAutor der Antwort Ram G Athreya
Können Sie dies mit nur einer CSS-änderung:
http://jsfiddle.net/ayiem999/HW43Q/
InformationsquelleAutor der Antwort airi
Stil hinzufügen
display:inline-block;
zucontenteditable
wird, wird es nicht erzeugendiv
p
undspan
automatisch in Chrome.InformationsquelleAutor der Antwort Le Tung Anh
Versuchen Sie dies:
http://jsfiddle.net/rooseve/jDvau/3/
InformationsquelleAutor der Antwort Andrew
Verwenden Sie shift+enter anstelle von enterum nur ein einziges
<br>
tag oder wickeln Sie Ihren text in<p>
- tags.InformationsquelleAutor der Antwort Blake Plumb
Den Weg, dass
contenteditable
verhält, wenn Sie drücken Sie die Taste enterhängt von Browsern, die<div>
passiert auf webkit (chrome, safari) und IE.Ich kämpfte mit diesem vor einigen Monaten und ich korrigierte er auf diese Weise :
Ich hoffe, es wird helfen, und sorry für mein Englisch, wenn es nicht so klar wie nötig.
BEARBEITEN : Korrektur entfernt jQuery-Funktion
jQuery.browser
InformationsquelleAutor der Antwort Elie
Er überschreibt das Standardverhalten zu haben Absatz statt.
In chrome das Standard-Verhalten auf enter:
Mit diesem Befehl ist es gonna be
Nun, dass es mehr linear über ist es einfach nur
<br>
würden Sie brauchen, um.InformationsquelleAutor der Antwort Ced
Ich verwenden würde, styling (Css) um das Problem zu beheben.
Firefox in der Tat fügt ein block-element Pause
in der Erwägung, dass Chrome wird jeder Abschnitt in einem tag. Sie css divs ein-Polsterung der 10px zusammen mit der Hintergrundfarbe.
Alternativ können Sie replizieren die gleiche gewünschte Effekt in jQuery:
Hier eine Gabel von Ihrem fiddle http://jsfiddle.net/R4Jdz/7/
InformationsquelleAutor der Antwort cbayram
Versuchen Sie es mit ckeditor. Es auch eine Formatierung wie diese in SOF.
https://github.com/galetahub/ckeditor
InformationsquelleAutor der Antwort Dan Rey Oquindo
Können Sie wickeln Sie Ihre Absätze mit
<p>
tag zum Beispiel wäre es apper auf die neue Linie anstelle von divBeispiel:
<div contenteditable="true"><p>Line</p></div>
Nach dem einfügen der neuen Zeichenfolge:
<div contenteditable="true"><p>Line</p><p>New Line</p></div>
InformationsquelleAutor der Antwort nes
Können Sie separate
<p>
- tags für jede Zeile, anstatt mit<br>
tags und gewinnen Sie mehr browser-Kompatibilität out of the box.Um dies zu tun, setzen Sie ein
<p>
tag mit einigen Standard-text in der contenteditable div.Z. B. anstelle von:
Verwenden:
jsfiddle
Getestet in Chrome, Firefox und Rand, und die zweite funktioniert auf die gleiche in jedem.
Den ersten, jedoch schafft divs in Chrom, erzeugt Zeilenumbrüche in Firefox, und bei Edge schafft divs und Sie den cursor wieder an den Anfang des aktuellen div-anstatt sich in die nächsten ein.
Getestet in Chrome, Firefox und Edge.
InformationsquelleAutor der Antwort Josh Powlison
fügen Sie einen Standard, um zu verhindern, dass die div
InformationsquelleAutor der Antwort Math chiller
Zunächst müssen wir festhalten-key-user eingeben, um zu sehen, wenn die EINGABETASTE gedrückt wird, dann verhindern wir die
<div>
Schöpfung und wir schaffen unsere eigene<br>
tag.Gibt es ein problem, wenn wir es schaffen unsere cursor Aufenthalt in der gleichen position, so verwenden wir Selection-API unseren cursor an das Ende.
Vergessen Sie nicht, fügen Sie ein
<br>
- tag am Ende von deinem text, denn wenn man nicht den ersten geben Sie nicht eine neue Zeile.Fiddle
InformationsquelleAutor der Antwort L105
Browser gerichtet HTML5-editor. Sie können wickeln Sie Ihren text mit
<p>...</p>
dann wenn Sie die EINGABETASTE drücken, erhalten Sie<p></p>
. Auch der editor funktioniert auf diese Weise, dass, wenn Sie drücken Sie SHIFT+ENTER fügt es<br />
.Prüfen:
http://jsfiddle.net/ZQztJ/
InformationsquelleAutor der Antwort Mehdi
Wo
this
ist der eigentliche Kontext, was bedeutet, dassdocument.getElementById('test');
.InformationsquelleAutor der Antwort webprogrammer
Anderen Weg, es zu tun
http://jsfiddle.net/jDvau/11/
InformationsquelleAutor der Antwort BlueUnicorn
Ich hatte das gleiche problem und die Lösung gefunden (CHROME, MSIE, FIREFOX), Folgen Sie meinen code in den link.
https://jsfiddle.net/kzkxo70L/1/
InformationsquelleAutor der Antwort Fábio Zangirolami
Ist es möglich, zu verhindern, dass dieses Verhalten völlig.
Sehen Sie diese Geige
InformationsquelleAutor der Antwort Omnicon
Verhindern, dass Neue Div-Erstellung im content-editable Div auf jeder Eingabe-Taste: die Lösung, die ich habe finden ist ganz einfach:
Diese --- innerHTML-Inhalt verhindern, dass Neue Div-Erstellung im content-editable Div auf jeder Eingabe-Taste.
InformationsquelleAutor der Antwort DrShyam Babu Gupta