textarea placeholder 文本輸入框的提示文字 該怎麼換行

發生什麼事

最近在研究著 Chart JS,想說寫個功能來玩玩

寫有一個輸入框供 User 輸入圖表資料,來動態產生圖表

但在提示文字(placeholder) 的時候卻遇到了問題,換行怎麼不能用 \n 換行符號呢?

明明這在程式界幾乎無往不利啊!

⬇大家可以自己試試看,不管是 ‘\n‘, ‘\r\n‘ 或是死馬當活馬醫的</br>都無法換行

See the Pen textarea_placeholder_test by story zyra (@story-zyra) on CodePen.

經過了一番尋找後,終於找到了解決方法!

他們就是 「&#13;」「&#10;」

等一下,不要急著離開,他們不是亂碼啊!

他們分別是ASCII 碼中的

LF : Line Feed 表示換行 = \n ,ASCII code 為 10

CR : Carriage Return 就是Enter的效果 = \r ,ASCII code 為 13

故本來的\r\n就可以用這個來替換

⬇來看看效果如何

See the Pen textarea_placeholder_asciicode by story zyra (@story-zyra) on CodePen.

大成功!! 可以洗洗睡囉!


結論

ASCII code果然很神奇呢,應該要找時間翻翻長滿灰塵的大學課本了…

另外,希望最近寫的圖表功能有一天可以上線給大家玩看看

🧡希望這篇文章有幫上你的一點點忙

🧡幫我點一個小小的廣告或留言,都是對我的支持(每天都只有詐騙留言Q口Q)

✅如有任何疑問,歡迎透過留言或messenger讓我知道 !

一些隨機的筆記

發佈留言

發佈留言必須填寫的電子郵件地址不會公開。 必填欄位標示為 *