textarea标签中placeholder实现换行

代码2020-06-03333 人已阅来源:网络

html控件中如何实现在placeholder中换行提示。因为在placeholder不会解析html代码,所以用换行符 <br/>/r/n 等都没有作用。我们可以用用转义字符代替<br/>

&#13; 表示回车 
&#10; 表示换行
运行代码
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>textarea标签中placeholder实现换行-aihongxin.com</title>
</head>
<body>
  <textarea name="" cols="30" rows="10" placeholder="第一行&#13;&#10;第二行&#13;&#10;很长的一行啊,你看看是不是很长的一行啊,果然就是很长的一行啊,再看看看是不是&#13;&#10;by:aihongxin.com"></textarea>
</body>
</html>

需要注意一下:

  • input不能换行,只有textarea会自动换行
  • 只在chrome,firefox里面测试过,ie真不考虑