How to display TextArea value in <Span> innerHTML with <br> in Netscape

Discussion in 'Javascript' started by xhe, Feb 7, 2007.

  1. xhe

    xhe Guest

    I met a very headache problem in javascript, I think this might be
    difference between IE and NS / Safari.

    I have a text area
    <form>
    <textarea name='tex1' onkeyup='displayit();'></textarea>
    </form>
    <span id="txtValue"></span>

    <script language='javascript'>
    function displayit()
    {

    document.getElementById("txtValue").innerHTML=document.forms[0].tex1.value;
    }
    </script>

    This is a very simple program.
    When I run in IE, and no problem, line break in the textares changed
    to <br> in the span tag, and line changed automatically.
    Problem here is when I run it in Netscape and Safari, the line break
    in textarea does not change to <br>, and all the text in the textares
    are displayed in one paragraph.

    Can anyone tell me how to display the multi-line paragraph contents
    of the textarea in the <span> innerHTML correctly to have <br>
    there? This is only for NS and Safari. Maybe this is their bugs?

    Thanks.
    Please email me at
    xhe, Feb 7, 2007
    #1
    1. Advertising

  2. xhe

    RobG Guest

    On Feb 7, 3:27 pm, "xhe" <> wrote:
    > I met a very headache problem in javascript, I think this might be
    > difference between IE and NS / Safari.
    >
    > I have a text area
    > <form>
    > <textarea name='tex1' onkeyup='displayit();'></textarea>
    > </form>
    > <span id="txtValue"></span>
    >
    > <script language='javascript'>
    > function displayit()
    > {
    >
    > document.getElementById("txtValue").innerHTML=document.forms[0].tex1.value;}
    >
    > </script>
    >
    > This is a very simple program.
    > When I run in IE, and no problem, line break in the textares changed
    > to <br> in the span tag, and line changed automatically.
    > Problem here is when I run it in Netscape and Safari, the line break
    > in textarea does not change to <br>, and all the text in the textares
    > are displayed in one paragraph.
    >
    > Can anyone tell me how to display the multi-line paragraph contents
    > of the textarea in the <span> innerHTML correctly to have <br>
    > there?


    <script type='text/javascript'>
    function displayit() {
    document.getElementById("txtValue").innerHTML =
    document.forms[0].tex1.value.replace(/\n/g,'<br>');
    }
    </script>

    You may need to test and replace CF or LF characters too, I only
    tested quickly in Firefox, IE and Opera.


    > This is only for NS and Safari.


    And Firefox and Opera...


    > Maybe this is their bugs?


    There is no public specification for innerHTML, so simple variances in
    behaviour can't be said to be a bug. :) All you can say is that it
    behaves differently in some browsers to others and deal with it (or
    don't use it).


    --
    Rob
    RobG, Feb 7, 2007
    #2
    1. Advertising

  3. xhe

    Elegie Guest

    Re: How to display TextArea value in <Span> innerHTML with <br> inNetscape

    xhe wrote:

    Hi Xhe,

    > Can anyone tell me how to display the multi-line paragraph contents
    > of the textarea in the <span> innerHTML correctly to have <br>
    > there?


    Why not simply substitute line breaks in your source text by BR tags,
    right before writing your innerHTML?

    <form action="#">
    <textarea onkeyup="foo(this.value)"></textarea>
    <span id="txtValue"></span>
    </form>
    <script type="text/javascript">
    function foo(s){
    document.getElementById("txtValue").innerHTML=
    s.
    replace(/&/g,"&amp;").
    replace(/</g,"&lt;").
    replace(/>/g,"&gt;").
    replace(/\r\n|\r|\n/g,"<br>");
    }
    </script>

    (untested on the targeted platform)


    Regards,
    Elegie.
    Elegie, Feb 8, 2007
    #3
    1. Advertising

Want to reply to this thread or ask your own question?

It takes just 2 minutes to sign up (and it's free!). Just click the sign up button to choose a username and then you can ask your own questions on the forum.
Similar Threads
  1. Fulio Open

    Can span include span?

    Fulio Open, Jun 26, 2009, in forum: HTML
    Replies:
    5
    Views:
    545
    dorayme
    Jun 26, 2009
  2. Stéphane Klein
    Replies:
    2
    Views:
    1,752
    John Nagle
    Mar 30, 2010
  3. Stefan Behnel
    Replies:
    0
    Views:
    481
    Stefan Behnel
    Mar 29, 2010
  4. Dan Bishop

    DataGrid (body only) contained in <span>...</span> tags

    Dan Bishop, Jun 7, 2004, in forum: ASP .Net Datagrid Control
    Replies:
    2
    Views:
    274
    Kilic Beg
    Jun 7, 2004
  5. Wang, Jay
    Replies:
    5
    Views:
    467
    Wang, Jay
    May 25, 2004
Loading...

Share This Page