更新(2016年1月):这个漂亮的小黑客可能不再适用于所有浏览器，所以我有一个新的解决方案，下面有一小部分javascript。

一个不错的小技巧

这感觉不太好，但你可以把新行放到html中。是这样的:

<textarea rows="6" id="myAddress" type="text" placeholder="My Awesome House " 朗街1号 伦敦 邮政编码 英国" > < / >文本区域

注意，每一行都在新行上(没有被换行)，每个“制表符”缩进是4个空格。虽然这不是一个很好的方法，但它似乎是有效的:

http://jsfiddle.net/01taylop/HDfju/

每行的缩进程度可能会根据文本区域的宽度而变化。 重要的是设置resize: none;在css中，这样文本区域的大小是固定的(参见jsfiddle)。

另外 当你想要一个新的行，点击返回两次(所以在你的“新行”之间有一个空行。这个“空行”创建需要有足够的制表符/空格，将等同于你的文本区域的宽度。如果你有太多似乎并不重要，你只需要足够。这太脏了，可能不兼容浏览器。我希望有更简单的方法!

更好的解决方案

查看JSFiddle。

This solution positions a div behind the textarea. Some javascript is used to change the background colour of the textarea, hiding or revealing the placeholder appropriately. The inputs and placeholders must have the same font sizes, hence the two mixins. The box-sizing and display: block properties on the textarea are important or the div behind it will not be the same size. Setting resize: vertical and a min-height on the textarea are also important - notice how the placeholder text will wrap and expanding the textarea will keep the white background. However, commenting out the resize property will cause issues when expanding the textarea horizontally. Just make sure the min-height on the textarea is enough to cover your entire placeholder at its smallest width.**

HTML:

<form>
  <input type='text' placeholder='First Name' />
  <input type='text' placeholder='Last Name' />
  <div class='textarea-placeholder'>
    <textarea></textarea>
    <div>
      First Line
      <br /> Second Line
      <br /> Third Line
    </div>
  </div>
</form>

SCSS:

$input-padding: 4px;

@mixin input-font() {
  font-family: 'HelveticaNeue-Light', 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, 'Lucida Grande', sans-serif;
  font-size: 12px;
  font-weight: 300;
  line-height: 16px;
}

@mixin placeholder-style() {
  color: #999;
  @include input-font();
}

* {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

form {
  width: 250px;
}

input,textarea {
  display: block;
  width: 100%;
  padding: $input-padding;
  border: 1px solid #ccc;
}

input {
  margin-bottom: 10px;
  background-color: #fff;

  @include input-font();
}

textarea {
  min-height: 80px;
  resize: vertical;
  background-color: transparent;
  &.data-edits {
    background-color: #fff;
  }
}

.textarea-placeholder {
  position: relative;
  > div {
    position: absolute;
    z-index: -1;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    padding: $input-padding;
    background-color: #fff;
    @include placeholder-style();
  }
}

::-webkit-input-placeholder {
  @include placeholder-style();
}
:-moz-placeholder {
  @include placeholder-style();
}
::-moz-placeholder {
  @include placeholder-style();
}
:-ms-input-placeholder {
  @include placeholder-style();
}

Javascript:

$("textarea").on('change keyup paste', function() {
  var length = $(this).val().length;
  if (length > 0) {
    $(this).addClass('data-edits');
  } else {
    $(this).removeClass('data-edits');
  }
});

试试这个:

<textarea
placeholder="Line1&#x0a;&#x09;&#x09;&#x09;Line2"
cols="10"
rows="5"
style="resize:none">
</textarea>

http://jsfiddle.net/vr79B/

我喜欢Jason Gennaro和Denis Golomazov的作品，但我想要一些在全球范围内更有用的东西。我已经修改了这个概念，这样它就可以添加到任何页面而不受影响。

http://jsfiddle.net/pdXRx/297/

<h1>Demo: 5 different textarea placeholder behaviors from a single JS</h1>

<h2>Modified behaviors</h2>

<!-- To get simulated placeholder with New Lines behavior,
     add the placeholdernl attribute -->

<textarea placeholdernl>    (click me to demo)
Johnny S. Fiddle
248 Fake St.
Atlanta, GA 30134</textarea>

<textarea placeholder='Address' placeholdernl>    (click me to demo)
Johnny S. Fiddle
248 Fake St.
Atlanta, GA 30134</textarea>

<h2>Standard behaviors</h2>

<textarea placeholder='Address'>    (delete me to demo)
Johnny S. Fiddle
248 Fake St.
Atlanta, GA 30134</textarea>

<textarea>    (delete me to demo)
Johnny S. Fiddle
248 Fake St.
Atlanta, GA 30134</textarea>

<textarea placeholder='Address'></textarea>

javascript非常简单

<script>
(function($){
var handleFocus = function(){
    var $this = $(this);
    if($this.val() === $this.attr('placeholdernl')){
        $this.attr('value', '');
        $this.css('color', '');
    }
};

var handleBlur = function(){
    var $this = $(this);
    if($this.val() == ''){
        $this.attr('value', $this.attr('placeholdernl'))
        $this.css('color', 'gray');
    }    
};

$('textarea[placeholdernl]').each(function(){
    var $this = $(this),
        value = $this.attr('value'),
        placeholder = $this.attr('placeholder');
    $this.attr('placeholdernl', value ? value : placeholder);
    $this.attr('value', '');
    $this.focus(handleFocus).blur(handleBlur).trigger('blur');
});
})(jQuery);
</script>

不要认为你可以这样做:http://www.w3.org/TR/html5/forms.html#the-placeholder-attribute

相关内容(重点我):

占位符属性表示一个简短的提示(一个单词或简短的提示) 短语)，用于帮助用户在控件出现故障时输入数据 没有价值。方法的示例值或简要描述可以是提示 预期的格式。如果指定了属性，则该属性的值必须为 不包含U+000A换行(LF)或U+000D回车(CR) 字符。

稍微改进了Jason Gennaro的回答(见代码注释):

var placeholder = 'This is a line \nthis should be a new line';
$('textarea').attr('value', placeholder);
$('textarea').focus(function(){
    if($(this).val() == placeholder){
        // reset the value only if it equals the initial one    
        $(this).attr('value', '');
    }
});
$('textarea').blur(function(){
    if($(this).val() == ''){
        $(this).attr('value', placeholder);
    }    
});
// remove the focus, if it is on by default
$('textarea').blur();

旧的回答:

不，你不能在占位符属性中这样做。你甚至不能用html编码像&#13;&#10;在占位符中。

新回答:

现代浏览器为您提供了几种方法。请看这个JSFiddle:

http://jsfiddle.net/pdXRx/5/