いしなお!
2006-08-23 [長年日記]
_ [1470.net][仕様変更] 1470.netメモの一覧表示時の可読性向上
メモを一覧表示する際、メモのパーマリンク表示時以外では、255バイト以上は省略表示していたのを、1000バイトまで省略せずに表示するようにしました。また、省略表示時にも改行は有効になるようにしました。
また、省略表示時に「続きを読む」をクリックすると、従来はメモのパーマリンクに遷移していましたが、Ajaxが有効な環境の場合はその場でコメント全文を表示するように変更しました。
_ [JavaScript][正規表現] String.replace(/\n/g, '<br />')の挙動の違い
↑の2番目の機能を実現するために、Ajaxで取ってきたメモのJSONデータ中に含まれるプレーンテキスト形式のコメント本文を、
comment.escapeHTML().replace(/\n/g, '<br />')
してからinnerHTMLにセットしているんだけど(escapeHTML()はprototype.jsの拡張ね)、FirefoxとOperaでは想定通り表示されるのに、IEではなぜか連続した改行が1個の<br />になってしまい、空行が表現できていない模様。これって何が原因なんだ?
String.escapeHTML()のせいだった
IEでString.escapeHTML()した段階で、連続改行が消えてしまうらしい。確かprototype.jsのesacpeHTML処理ってブラウザ依存の特殊な書き方だった気がするし、そのせいだろうな。
というわけで、自前で置換を使ったescapeHTML()相当の処理に書き直して対応。ただ、非Windows環境ではまた別の問題が出るのかも?
IEの場合は.replace(/\r\n/g, '<br />')とかやるとうまくいかないですか?<br>前に同じ事ではまった経験があって、今コード探してきたらこんな感じで対応していました。<br>(/(\r\n|\r|\n)/g, '<br />')<br>確か Mac の IE か何かが \r だけで、Firefxは \n で、IEが \r\n と。
本文の方に追記しましたが、prototype.jsで拡張されたString.escapeHTML()の段階で、連続改行が消されてしまうのが原因でした。<br><br>改行コードの揺らぎの問題は、それとは別に発生しているかもしれませんが、ひとまず手元に発生環境がないので、出てきたら対応しよう。