Tekst wielowierszowy jest wyświetlany jako pojedyncza linia w firefoxie przy użyciu powiązań knockoutjs

Question

Po prostu wpadłem na dziwne zachowanie tekstu wielowierszowego w firefoxie przy użyciu wiązań knockout. Oto moje skrzypce: http://jsfiddle.net/NznVZ/.

Mamy textarea i span z powiązaniem wartości/tekstu z tym samym obserwowalnym. Obecnie Chrome i IE wyświetlają tekst wielowierszowy w elemencie span, ale firefox nie (po prostu łączy kilka linii w 1).

Czy ktoś może wyjaśnić, co jest/gdzie jest problem? Może ktoś już napotkał na ten problem i ma rozwiązanie?

Z góry dziękuję z wyprzedzeniem

P.S. Firefox 12, IE 9, Chrome 18

Answer 1

Ustawianie stylu white-space: pre-wrap o rozpiętości uczyni to działa: http://jsfiddle.net/mbest/NznVZ/12/

Tutaj jest trochę tła. IE i Chrome konwertują nowe linie w ciągu znaków do elementów <br> w kodzie HTML, gdy tekst jest ustawiony przy użyciu innerText, czyli tego, czego używa Knockout. Firefox nie ma innerText, więc Knockout używa textContent, który nie wykonuje żadnej konwersji ciągu. (Co ciekawe, Chrome pasuje Firefox podczas korzystania styl 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 (bez stylu white-space):

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

Firefox i Chrome (z biało- space style):

Answer 2

Jeśli chcesz rozwiązanie JavaScript: http://jsfiddle.net/9KAQX/

Jedyną zaletą jest to, że znaki "\ n" nie występują w przestrzeni.