Il testo multilinea viene visualizzato come una singola riga in firefox utilizzando i binding di knockoutjs

Question

Ho appena imbattuto in un comportamento piuttosto strano del testo multilinea in firefox utilizzando i binding di knockoutjs. Ecco il mio violino: http://jsfiddle.net/NznVZ/.

Abbiamo un'area di testo e intervallo con valore/testo vincolante per lo stesso osservabile. Attualmente, Chrome e IE visualizzano un testo multilinea in span element, ma Firefox non lo fa (concatena solo più righe in 1).

Qualcuno può spiegare qual è/dove è il problema? Forse qualcuno si è già imbattuto in questo problema e ha una soluzione?

Grazie in anticipo

P.S. Firefox 12, Internet Explorer 9, Chrome 18

Answer 1

Impostazione dello stile white-space: pre-wrap sul lasso farà funzionare: http://jsfiddle.net/mbest/NznVZ/12/

Ecco un po 'di storia. IE e Chrome convertiranno le nuove righe nella stringa in elementi <br> nel codice HTML quando il testo viene impostato utilizzando innerText, che è ciò che usa Knockout. Firefox non ha innerText quindi Knockout utilizza textContent, che non esegue alcuna conversione della stringa. (È interessante notare che, Chrome corrisponde Firefox quando si utilizza lo stile white-space: pre-wrap.)

IE:

<span>First line.<br>Second Line.<br>&nbsp;&nbsp;&nbsp;&nbsp; Third line preceded with 5 space characters.</span> 

Chrome (senza stile bianco-spazio):

<span>First line.<br>Second Line.<br>  Third line preceded with 5 space characters.</span> 

Firefox e Chrome (con bianco- space style):

<span>First line. 
Second Line. 
    Third line preceded with 5 space characters.</span> 

Answer 2

Se si desidera una soluzione javascript: http://jsfiddle.net/9KAQX/

L'unico vantaggio qui è che i caratteri "\ n" non sono presenti nello span.