\ n does not work in IE8 - JavaScript

4

Hello. I'm having problems with IE8, only in it, other browsers and different versions have already been tested and worked, only IE8 does not work.

I have a question page in YES / NO as a choice on radio buttons. Underneath a submit button. When the user responds and clicks send, plays the questions with answers in the textarea. However, in IE8, it does not comply with the \ n in textarea, so it's all in one line.

I have already used \n , \r\n , \cr and even the ASCII 13 code, and even then IE8 does not work. Could someone help me?

<script>
function PreencherCampo(){
    var procn1 =  document.getElementById("procn1").innerHTML;
    var pergunta1 =  document.getElementById("pergunta1").innerHTML;
    var pergunta2 =  document.getElementById("pergunta2").innerHTML;
    var pergunta3 =  document.getElementById("pergunta3").innerHTML;
    var procfield = document.getElementById("procfield").innerHTML;
    var pecsug = document.getElementById("pecsug").innerHTML;

    var elementos1 = document.getElementsByName('pergunta1'); 
    var resposta1 = '';
        for (i = 0; i < elementos1.length; i++) {
        if (elementos1[i].checked) {
        resposta1 = elementos1[i].value;
        }
    }

    var elementos2 = document.getElementsByName('pergunta2'); 
    var resposta2 = '';
        for (i = 0; i < elementos2.length; i++) {
        if (elementos2[i].checked) {
        resposta2 = elementos2[i].value;
        }
    }

    var elementos3 = document.getElementsByName('pergunta3'); 
    var resposta3 = '';
        for (i = 0; i < elementos3.length; i++) {
        if (elementos3[i].checked) {
        resposta3 = elementos3[i].value;
        }
    }

        document.getElementById("resposta").innerHTML = procn1 + '\r\n'+
                        pergunta1 + ': ' + resposta1 + '\r\n'+ 
                        pergunta2 + ': ' + resposta2 + '\r\n'+ 
                        pergunta3 + ': ' + resposta3 + '\r\n\n'+
                        procfield + '\r\n'+
                        pecsug;
}
</script>  
    
asked by anonymous 18.04.2016 / 04:42

1 answer

2

As others have mentioned you have to use <br /> , this is semantically correct in HTML since you are generating an HTML string.

You can also simplify your code and make it independent of the number of questions. One suggestion would look like this:

function PreencherCampo() {
    var procn1 = document.getElementById('procn1').innerHTML;
    var pecsug = document.getElementById('pecsug').innerHTML;
    var procfield = document.getElementById('procfield').innerHTML;

    var respostas = [1, 2, 3].reduce(function(str, nr) {
        var p = document.getElementById('pergunta' + nr).innerHTML;
        var r = [].filter.call(document.getElementsByName('pergunta' + nr), function(el) {
            return el.checked && el.value;
        })[0] || '';
        return [p, ': ', r, '<br/>'].join('');
    });
    document.getElementById('resposta').innerHTML = [procn1, respostas, procfield, pecsug].join('<br/>');
}

I did not test, but if you have a bug, make a jsFiddle with your HTML that I correct.

    
18.04.2016 / 10:12