textarea placeholder文字换行
要实现这样的效果
第一反应是直接在placeholder属性值里输入\n换行，如：
<textarea rows="5" cols="50" placeholder="1、textarea\n2、success"></textarea>
浏览器直接输出了它，类似地输入<br/>也行不通
解决方法是换成
<textarea rows="5" cols="50" placeholder="1、textarea 2、success"></textarea>
效果立竿见影， 是unicode字符中的换行符。
另外用js直接设置textarea的placeholder属性值为'1、textarea\n2、success'也是可行的
document.querySelector('textarea').setAttribute('placeholder','1、textarea\n2、success')
注意：两种方式仅被Chrome浏览器支持（2017-06-06）
源代码：
<!DOCTYPE html>
<html>
<head>
<title>textarea placeholder换行</title>
</head>
<body>
<textarea rows="5" cols="50" ></textarea>
<textarea rows="5" cols="50" placeholder="1、textarea 2、success"></textarea>
<script type="text/javascript">
document.querySelector('textarea').setAttribute('placeholder','1、textarea\n2、success')
</script>
</body>
</html>
BTW，科普一下“换行”和“回车”的区别：
"回车"（carriage return）和"换行"（line feed）是来源机械英文打字机，"车"指的是纸车,带着纸一起左右移动的模块， 当开始打第一个字之前，要把纸车拉到最右边，上紧弹簧，随着打字， 弹簧把纸车拉回去，每当打完一行后，纸车就完全收回去了，所以叫回车。换行的概念是打字机左边有个"把手 ",往下 扳动一下,纸会上移一行。
textarea placeholder文字换行的更多相关文章
- 修改 input / textarea placeholder 属性的颜色和字体大小
话不多说,直接上代码: input::-webkit-input-placeholder, textarea::-webkit-input-placeholder { color: #666; fon ...
- 如何让textarea placeholder 文字垂直居中
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8" ...
- textarea之placeholder
placeholder 属性适用于以下的 <input> 类型:text, search, url, telephone, email 以及 password.这个属性是html5才有的新 ...
- 修改input和textarea的placeholder的颜色，限制文本框字数输入
<style type="text/css"> textarea{ width: 400px; height:400px; resize: none; } .limit ...
- 使用JQuery统计input和textarea文字输入数量代码
本文主要介绍了jQuery实现统计输入文字个数的方法,需要的朋友可以参考下. HTML部分: <input type="text" value="我是输入的文字&q ...
- 兼容IE8 input的placeholder的文字显示
if( !('placeholder' in document.createElement('input')) ){ $('input[placeholder],textarea[placeholde ...
- Placeholder在IE8的兼容问题
<script type="text/javascript"> if( !('placeholder' in document.createElement('input ...
- placeholder不兼容 IE10 以下版本的解决方法
对于密码输入框placeholder的兼容问题:HTML代码:<input type="password" id="loginPassword" plac ...
- 【JS】IE兼容placeholder
直接上代码: $(document).ready(function () { var doc = document, textareas = doc.getElementsByTagName('tex ...
随机推荐
- 利用callKit实现电话防骚扰
callKit框架是ios10之后更新的一个框架,代替了原来的CoreTelephony.framework,使用CallKit可以实现电话的拦截 首先创建一个项目之后,创建一个target,选择Ca ...
- [原创] JavaScript实现简单的颜色类标签云
效果预览: 源码分享: <!DOCTYPE html><html><head lang="en"> <meta charset=" ...
- Ubuntu下安装Tomcat7
第一部分:基本安装 1.打开http://tomcat.apache.org/download-70.cgi,下载apache-tomcat-7.0.68.zip. 2.拷贝至合适位置,如/usr/l ...
- sed命令详解-应用篇
本篇从实用的角度讲解sed,关于sed的详细帮助文档,请参考前篇 http://www.cnblogs.com/the-capricornus/p/5279979.html 本篇用到的选项请参考前篇. ...
- CVSS3.0打分学习
打分计算器: Common Vulnerability Scoring System Version 3.0 Calculator: https://www.first.org/cvss/calcul ...
- GTK简单了解记录
GTK+http://zh.wikipedia.org/wiki/GTK%2B#.E5.9B.BE.E5.BD.A2.E6.97.A0.E5.85.B3.E4.BB.A3.E7.A0.81 GTK+最 ...
- macOS 下配置 MAMP 开发环境（Mac + Apache + Mysql + PHP）
macOS 中已经内置了 PHP.Python.Ruby.Perl 等常用的脚本语言,以及 Apache HTTP 服务器,所以使用起来非常方便.本文以最新的 macOS Sierra 10.12 配 ...
- 蓝桥杯-凑算式-java
/* (程序头部注释开始) * 程序的版权和版本声明部分 * Copyright (c) 2016, 广州科技贸易职业学院信息工程系学生 * All rights reserved. * 文件名称: ...
- HashSet实现原理
/* HashSet的实现原理: 往HashSet添加元素的时候,HashSet会先调用元素的hashCode方法得到元素的哈希值 , 然后通过元素 的哈希值经过移位等运算,就可以算出该元素在哈希表中 ...
- 【Android Widget】FragmentTabHost
android.support.v4包里面提供了FragmentTabHost用来替代TabHost,FragmentTabHost内容页面支持Fragment,下面我们就通过示例来看他的用法 效果图 ...