简体   繁体   中英

What characters will a TextArea wrap at, other than spaces?

I'm working on the latest version of my plugin, Textarea Line Counter ( http://mostthingsweb.com/?p=84 ). To make it even more accurate, I want to identify regions of text that wrap because they are too large to fit on the line (like a sequence of repeated characters).

I'm assuming that browsers only wrap text at spaces. Are there any other characters that lines can be wrapped at? Thank you,

Looks like it depends on the browser, my Opera wraps also on eg + % ? $ / ( [ { } \\ ° ! ¿ + % ? $ / ( [ { } \\ ° ! ¿
Safari/Chrome on ¿ ? too

(guess there are lots more)

Nice idea for a plugin. Fighting the accuracy issues is going to be a challenge.

There's not a universal catch all for the way textarea is going to handle a string (other than line breaks at spaces), or using word-wrap.

OSX中的FireFox屏幕截图

IE produced a break with . , () {} ? . , () {} ? , but not with / * = +

IE7,8

In this example, textarea seems to have that "special" feeling like a td

Based on all your advice, I have created a solution. It is rather large, and in fact I think I will make it into a separate plugin, as well as including it in my Textarea Line Counter. It works like this:

  1. Create a div to act as a container, and set the font to something monospaced (ie every character is the same width)
  2. Create a span within the container, and place a single letter.
  3. Take the width measurement of the span (which will be the width of the letter, once margins, padding, and some other CSS attributes are cloned)
  4. Create another div within the container and clone its CSS attributes. Set it's width to be two times the width of the letter found in step 3, and record its height.
  5. To test if a character will cause a wrap, set the text of the div to: A[some character]A . [some character] is a character you are trying to test.
  6. Test the height of the div . If it is larger than the height found in step 4, the text has wrapped.

I'm looking forward to releasing this plugin. Thank you again for all your advice.

some browsers will break inside words if the word is longer than the col width, otherwise they break on spaces.

I notice some browsers set this by default- you can, too in most bowsers with:

textarea{word-wrap: break-word}

you can be sure it is not set by using textarea{word-wrap: normal}

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM