我尝试了一些方法，但没有一个奏效。有人知道绕过这个的妙招吗?
<textarea placeholder='This is a line \n this should be a new line'></textarea>
<textarea placeholder='This is a line
should this be a new line?'></textarea> <!-- this works in chrome apparently -->
更新:它不工作在chrome。它只是textarea的宽度。
参见:http://jsfiddle.net/pdXRx/
当前回答
使用& # 10;在\n的地方，这将改变这一行。
其他回答
但需要注意的是，问题的前提与W3规范不一致，因此不能保证行为，解决方案使用&x10;工作时<textarea>是要在HTML中定义:
<textarea
placeholder="HTML entity works but unicode entity hard-coded \u000A !">
</textarea>
但是如果<textarea>是用JavaScript创建的，那么 实体将在输出中硬编码。然而，使用unicode等效的\u000A是可以的:
let myArea = document.createElement("textarea");
myArea.placeholder = "Unicode works \u000A But HTML entity hard-coded !";
我来这里是为了一个多行占位符解决方案，然后我意识到接受的解决方案不工作时，文本区域是在formik形式。
在这种情况下，解决方案就是模板字面量。它允许您指定多行文本字符串。
<textarea
cols={40}
placeholder={`day 1: Temple visit,
day 2: Jungle barbeque,\n
day 3: Waterfall visit in the evening,\n
day 4: Visit UNESCO World Heritage Site,\n
day 5: Art gallery show,\n
day 6: Visit grand swimming pool,\n
day 7: Visit to Blue fort`}
rows={20}
/>
源
这个问题可以通过使用占位符显示的选择器和超级强加的背景来解决，如果你的实现允许:
textarea:not(:placeholder-shown) {
background: #fff;
}
div {
top: 0;
left: 14px;
color: rgba(0,0,0,0.4);
z-index: -1;
position: absolute;
line-height: 1.2;
white-space: pre-wrap;
}
https://codepen.io/franciscoaquino/pen/YzyBPYK
选择器支持:
https://caniuse.com/#feat=css-placeholder-shown
旧的回答:
不，你不能在占位符属性中这样做。你甚至不能用html编码像 在占位符中。
新回答:
现代浏览器为您提供了几种方法。请看这个JSFiddle:
http://jsfiddle.net/pdXRx/5/
您可以做的是将文本作为值添加，它尊重换行符\n。
$('textarea').attr('value', 'This is a line \nthis should be a new line');
然后你可以在焦点上删除它，然后在模糊上应用它(如果为空)。就像这样
var placeholder = 'This is a line \nthis should be a new line';
$('textarea').attr('value', placeholder);
$('textarea').focus(function(){
if($(this).val() === placeholder){
$(this).attr('value', '');
}
});
$('textarea').blur(function(){
if($(this).val() ===''){
$(this).attr('value', placeholder);
}
});
例如:http://jsfiddle.net/airandfingers/pdXRx/247/
不是纯粹的CSS，不干净，但做到了。
