@hunter129

          天天學(xué)習(xí),好好向上!

             :: 首頁 :: 新隨筆 :: 聯(lián)系 :: 聚合  :: 管理 ::
            21 隨筆 :: 5 文章 :: 37 評論 :: 0 Trackbacks
            在textarea中輸入的文本。如果含有回車或空格。在界面上顯示的時(shí)候則不哪么正常。回車消失了,空格變短了。
          如何解決這個(gè)問題呢。有2種方法。
          1.使用<pre>標(biāo)簽
             w3c對pre元素是這樣定義的:pre 元素可定義預(yù)格式化的文本。被包圍在 pre 元素中的文本通常會保留空格和換行符。而文本也會呈現(xiàn)為等寬字體。
             更詳細(xì)的內(nèi)容請參考 http://www.w3school.com.cn/tags/tag_pre.asp
             也就是說包含在pre標(biāo)簽中的回車和空格會正常的顯示出來。包括你在頁面代碼中輸入的。所以如果使用pre元素你需要這樣寫:
            
          <pre>要輸出的文本</pre>
             ,而不是這樣:
            
            <pre>
                要輸出的文本
            
          </pre>
             后一種寫法 文本前的空白也會被顯示的。除非你真的希望這樣:)
          2.對文本內(nèi)容進(jìn)行替換。
            回車和空格不能正確顯示,究其原因是他們各自的表示方式不同。在textarea里面輸入的回車是字符"\r",html中的回車(換行)是"<br/>"。
            textarea中輸入的空格是空白" ",而html中的一個(gè)空格是"&nbsp;"。理所當(dāng)然不能正確顯示。好了現(xiàn)在知道了原因就有了第二種解決方案了。
            只要我們將輸入的文本中相應(yīng)的"元素"替換成html認(rèn)識的就ok了。因此下面一行代碼即可解決問題:
           
          "要輸出的文本".replaceAll(" ","&nbsp;").replaceAll("\r","<br/>");
            等等。這里還有一點(diǎn)小問題。把一個(gè)空格替換成一個(gè)"&nbsp;"空格看上去仍然要少些。如果你喜歡可以替換成2個(gè)。
           
            最后,除了回車和空格以外還有很多空白字符如tab等,如果你喜歡可以一并處理了^_^
           
            最后的最后,如果本來的文本是很長的一行,使用pre標(biāo)簽后就不會自動換行。結(jié)果頁面出現(xiàn)橫向滾動條。不知道有沒有好的解決方法?
            而將第二種方法處理過的文本放在<p>標(biāo)簽中顯示,就可以顯示正常。
           
          posted on 2008-10-09 21:19 hunter129 閱讀(11974) 評論(13)  編輯  收藏 所屬分類: css基礎(chǔ)

          評論

          # re: 正確顯示taxtarea中輸入的回車和空格 2008-10-10 07:54 charlie's logic
          謝謝分享  回復(fù)  更多評論
            

          # re: 正確顯示taxtarea中輸入的回車和空格 2008-10-10 08:07 sitinspring
          總結(jié)得不錯(cuò)。  回復(fù)  更多評論
            

          # re: 正確顯示taxtarea中輸入的回車和空格 2008-10-10 08:40 toby941
          受用了  回復(fù)  更多評論
            

          # re: 正確顯示taxtarea中輸入的回車和空格 2008-10-10 10:15 二哥
          “使用pre標(biāo)簽后就不會自動換行”。在table屬性中加上“style="word-break:break-all;table-layout: fixed"”,在顯示的td中加上“style="word-wrap: break-word;"”可以自動換行,如<td style="word-wrap: break-word;"><pre>xxx</pre></td>  回復(fù)  更多評論
            

          # re: 正確顯示taxtarea中輸入的回車和空格 2008-10-11 20:29 落Nicety
          @二哥
          這樣設(shè)置在ie中確實(shí)換行了
          不過在ff中就沒這么幸運(yùn)了
          依然感謝~~  回復(fù)  更多評論
            

          # re: 正確顯示textarea中輸入的回車和空格 2010-02-22 01:41 jameslin
          但是我要在默認(rèn)值里顯示回車怎做?如果輸入<br/>,它就照搬顯示了  回復(fù)  更多評論
            

          # re: 正確顯示textarea中輸入的回車和空格 2010-02-22 09:56 落Nicety
          @jameslin
          不知道你這個(gè)默認(rèn)值是指在textarea中顯示,還是在pre中顯示

          在textarea中默認(rèn)有個(gè)回車這么寫就可以了
          <textarea>

          </textarea>

          在pre中顯示回車,這么寫
          <pre>
          </pre>  回復(fù)  更多評論
            

          # re: 正確顯示textarea中輸入的回車和空格 2010-03-17 09:06 游客
          正確顯示textarea中輸入的回車和空格:

          <textarea><pre>要顯示的內(nèi)容</pre></textarea>

          是這么用嗎?這樣的話,<pre> 標(biāo)簽也會顯示在textarea中。


          <textarea>"要輸出的文本".replaceAll(" ","&nbsp;").replaceAll("\r","<br/>")<textarea>

          這樣的話,回車符在<textarea>中以<br/>的形式顯示,也不合適,應(yīng)該怎么處理呢?  回復(fù)  更多評論
            

          # re: 正確顯示textarea中輸入的回車和空格 2010-03-23 21:57 落Nicety
          @游客
          不是。。 不知道你想把什么東西顯示在textarea中?

          這篇文章說的是正確的把 textarea 中輸入的東西以html的形式顯示出來。
          不是把內(nèi)容顯示在textarea中  回復(fù)  更多評論
            

          # re: 正確顯示textarea中輸入的回車和空格 2010-12-09 21:58 游客
          erer
          fdsfsf
          sdfsdfsdfsdfsd  回復(fù)  更多評論
            

          # re: 正確顯示textarea中輸入的回車和空格 2010-12-09 21:59 游客
          &<nbsp;> Test
          &<nbsp;> &<nbsp;> &<nbsp;> Test  回復(fù)  更多評論
            

          # re: 正確顯示textarea中輸入的回車和空格 2010-12-09 22:00 游客
          <br /> sfsd
            回復(fù)  更多評論
            

          # re: 正確顯示textarea中輸入的回車和空格[未登錄] 2014-03-13 09:31 00
          999
          00
          00
            回復(fù)  更多評論
            


          只有注冊用戶登錄后才能發(fā)表評論。


          網(wǎng)站導(dǎo)航:
           
          主站蜘蛛池模板: 元氏县| 澳门| 德阳市| 金寨县| 武强县| 尼勒克县| 罗平县| 娄底市| 平利县| 大田县| 苍梧县| 当阳市| 瓮安县| 娄底市| 西平县| 凤凰县| 大渡口区| 哈尔滨市| 汽车| 靖边县| 贡嘎县| 城口县| 望奎县| 固阳县| 旺苍县| 鞍山市| 棋牌| 胶州市| 巩留县| 麻城市| 广平县| 岳西县| 靖边县| 襄汾县| 乐平市| 南阳市| 焦作市| 潼南县| 富源县| 越西县| 营山县|