Internet Explorer \n line breaks not working

Question

In all versions of IE (I'm testing IE11 at the moment) new line breaks inside of textarea elements aren't working...

function id_(id)
{ 
 var r = false;
 if (document.getElementById(id))
 {
  r = document.getElementById(id);
 }
 return r;
}

window.onload = function()
{
 for (i in document.getElementsByTagName('audio')[0])
 {
  id_('test').value = id_('test').value + '\n' +i;
 }
}

How can I force IE to break lines in a textarea element? No frameworks.

I've tried \n\r, \r\n, \r and \n.

http://jsfiddle.net/ff5kqtru/ this seems to work in IE11. What are u trying to achieve by that loop? — Yuriy Galanter, Sep 22 '14 at 17:21
Try this `$('#test').val($('#test').value + '\n' +i);` ref:http://stackoverflow.com/questions/5583040/show-newlines-in-html-textarea/5583094#5583094 — Sainath Motlakunta, Sep 22 '14 at 17:24
`for (i in document.getElementsByTagName('audio')[0])` seems weird, are you sure it isn't `for (i in document.getElementsByTagName('audio'))`? — Igor Jerosimić, Sep 22 '14 at 17:28
@IgorJerosimić, I assume he's iterating through the properties of the first `audio` tag, hence the `[0]`. — Rick Hitchcock, Sep 22 '14 at 17:39

score 5 · Accepted Answer · answered Sep 22 '14 at 17:58

5

After minimizing the code the issue was the CSS white-space property which I fixed with the code below.

* {white-space: nowrap;}
textarea {white-space: pre;}

answered Sep 22 '14 at 17:58

John

1
13
98
177

2

It's really strange that IE ignores line feeds when white-space is set to `nowrap`. I've tried Chrome, Firefox, Safari, and Opera, and only IE shows this behavior. According to http://www.w3.org/wiki/CSS/Properties/white-space, line breaks *should* be suppressed for `nowrap`, so is it possible that IE is the *only* browser to get this right? – Rick Hitchcock Sep 22 '14 at 18:22
1

Even though we all hate IE I have to admit when they DO make an effort to interpret things correctly they really do well at doing so. Case in point when they took on `border-radius` (http://blogs.msdn.com/b/ie/archive/2010/03/19/the-css-corner-about-css-corners.aspx). – John Sep 22 '14 at 20:04
1

Thanks very much. Safari has just started doing this, so I was very grateful to find a solution. – SarahR Oct 20 '14 at 23:38

score 3 · Answer 2 · answered Sep 22 '14 at 17:27

In IE, \n does indeed generate line breaks in textarea elements. That is, this code:

<textarea id="target">default text here</textarea>
<script>document.getElementById('target').value = 'a\nb';</script>

does, in IE, result in a textarea which holds the value default text here for an unimaginably short time followed by the value:

a
b

If you really want to test your browser, I have put this on a JSFiddle at: http://jsfiddle.net/91mj2arh/

score 1 · Answer 3 · answered Sep 22 '14 at 17:37

1

This Fiddle based on your code adds line feeds in my version of IE11, and it seems to accomplish what you're looking for to iterate the audio element's properties:

http://jsfiddle.net/ff5kqtru/5/

If you post your HTML, we may be able to spot a problem.

answered Sep 22 '14 at 17:37

Rick Hitchcock

35,202
5
48
79

Internet Explorer \n line breaks not working

3 Answers3