0

I have a div with the attribute contentEditable set.

The trouble I am having is that the first line I type does not get wrapped in tags, but the subsequent lines do.

Input

abcd
efgh
ijkl

Result

<div contentEditable="true">
    "abcd"
    <div>efgh</div>
    <div>ijkl</div>
</div>
Mitul Verma
  • 237
  • 1
  • 15

2 Answers2

1

Try this : get text and children then make editable div empty and wrap text with div (I have added color:red to just know div added) and children.

$(function(){
    $('div[contentEditable="true"]').each(function(){
       var text = $(this).clone().children().remove().end().text();// get text
       var $children = $(this).children();// get children

       //add text and children again
       $(this).empty().append('<div style="color:red;">'+text+'</div>').append($children);
    });
});

Demo

Bhushan Kawadkar
  • 28,279
  • 5
  • 35
  • 57
-1

I dont know know what you are asking .but you need result 

 $("div[contentEditable=true]").text("abcd");
    $("div[contentEditable]").append("<div>efgh</div><div>ijkl</div>");

DEMO

Balachandran
  • 9,567
  • 1
  • 16
  • 26
  • I'm pretty sure this is not what the OP wants. Did you read the title? This is what he currently gets when he types the given input in a `contenteditable` `
    `. Line breaks automatically wraps the text in a `
    `, no need of script, OP is already getting it without it.
     – T J Jul 19 '14 at 06:16
  • @TilwinJoy k . what he is need could you tel me ? – Balachandran Jul 19 '14 at 06:25
  • He needs to wrap the text in first line in a `
    `, just just the ones after line break...
     – T J Jul 19 '14 at 07:32
  • looks like different browsers behaves differently though, http://lists.whatwg.org/pipermail/help-whatwg.org/2009-December/000386.html he might not get the same result given in question in all browsers, he probably tested it in chrome.. – T J Jul 19 '14 at 07:34