Question

I have a textarea box where the user types in a message then it outputs into a paragraph markup.
I am successful capturing the text but cannot seem to capture the line breaks.
heres my fiddle

Ideally a string substitution such as <br/> or \n is what i was looking for.

any help would be appreciated, thanks.

var txtBox = $('#myTextArea');
var txt = txtBox.val();

txtBox.keyup(function(){
        txt = txtBox.val();
        $('p.msg').html(txt);
});

txtBox.keydown(function (e) {
        var keyCode = e.keyCode || e.which;
        if (keyCode == 13) {
                $('p.msg').append('<br />');//ApplyLineBreaks(txt);
        }
});

and the markup

<textarea id="myTextArea" class="form_0" name="Enter your message" type="text"></textarea>
<p class="msg" style="text-align: center;">msg here</p>

Answer 1

You can do this with just the keydown event:

var txtBox = $('#myTextArea');
txtBox.keydown(function(e){
    var that = this;
    setTimeout(function(){
        $("p.msg").html(that.value.replace(/\n/g,"<br />"));
    },10);
});

http://jsfiddle.net/NJwhC/3/

The setTimeout is important, it allows the this.value to be populated before accessing it.