非常に長い言葉-何をすべきか?

問題の本質



スペースのないすっごく長い単語を入力し、それによってレイアウトを「爆発」させるユーザーの能力は古い問題です。 それが、Habréでの決定方法です。



いくつかの方法で解決できます。



最終divのスタイルを介して



1)style = " word-wrap: break-word"-ただし、この方法はIE専用です

2)style = " overflow: auto; white-space: nowrap"-どこでも動作する標準ソリューション。 しかし、スクロールバーは表示されます

3)style = " overflow: hidden; white-space: nowrap"-どこでも動作する標準ソリューション。 単語の「失われた」部分(見えない)。



PHPから



4)N文字ごとに単語をソフトハイフンで区切ります。 Nは、設定した最大許容語長です。

5)そのような単語を削除する



現在のプロジェクトでは、最初の4つのアプローチを使用しました。 後者は私には必要ないと思われました。



実行は許されません



顧客の要求に応じて、コンテキスト広告スクリプトが追加されました。 そして、テスターはすぐに問題を見つけました-彼は単語を長すぎて入力し、そのような単語を処理するために彼のサーバーに送信しようとすると(単語がソフトハイフネーションによって壊れていたとしても)広告システムは単にブラウザを切った。 より正確には、完全にぶら下がっていたわけではありません。 IEは反応し、20秒後にスクリプトの中断を提案しました。 何らかの理由でFirefoxが失敗し、電話が切れました:(



一般に、長すぎる単語を切り取るという問題が発生しました。 もちろん、これは標準的な方法で行うことができます-行をスペース(\ s +)に分割し、各単語の長さを測定して長すぎてスローして行を接着します。 しかし、これはいです:)私は定期的にだけそれをしたかったです。

解決策



フォーム[^ \ s] {512、}の構成が機能すると予想しました。512は「単語」の最大許容長です。 ただし、この設計は機能しませんでした。 構文[^ \ s] {512}は適合しませんでした。なぜなら、その後に「テール」があったからです(たとえば、単語の長さが600文字だった場合)。



少し苦しんだ後、彼らは出口に来て、すべての要求を満たしました:



preg_replace( '/ [^ \ s] {512} [^ \ s] + /'''$ string



したがって、すべての長い単語が正常に切り取られました。 必要に応じて、単語を完全に切り取らずに、許可された長さを残して省略記号を追加して、メカニズムを簡単に「改善」できます。



preg_replace( '/([^ \ s] {512})[^ \ s] + /''$ 1 ...'$ string



この問題をどのように解決しましたか?



UPD:コメントでは、入力フィールドにユーザーデータが表示されていないすべての場所で、overflow:hiddenを使用することを提案しています。



UPD2: atukaiは、許可された文字数の後に省略記号を付けるだけでなく、ヒント全体に単語全体を表示することも提案しました。

つまり、次のようになります。

preg_replace( '/([^ \ s] {25})[^ \ s] + /''<span title = "$ 0"> $ 1 ... </ span>'$ string





UPD3: タンポポは、 ワードラップ機能を完全に忘れたことを思い出しました。 この問題については、次のように使用できます。

$ string = wordwrap( $ string512'&shy;'true );

ただし、この関数はUTF-8では正しく機能しないことに注意してください。



All Articles