我尝试了一些方法,但没有一个奏效。有人知道绕过这个的妙招吗?

<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/


当前回答

但需要注意的是,问题的前提与W3规范不一致,因此不能保证行为,解决方案使用&x10;工作时<textarea>是要在HTML中定义:

<textarea 
  placeholder="HTML entity works &#10; but unicode entity hard-coded \u000A !">
</textarea>

但是如果<textarea>是用JavaScript创建的,那么&#10;实体将在输出中硬编码。然而,使用unicode等效的\u000A是可以的:

let myArea = document.createElement("textarea");
myArea.placeholder = "Unicode works \u000A But HTML entity hard-coded &#10; !";

其他回答

只添加&#10用于断行,不需要编写任何CSS或javascript。

textarea { 宽度:300 px; 身高:100 px; } <textarea占位符='这是一行这&#10应该是一个新行'></textarea> <textarea placeholder='这是一行 这应该是一条新线吗?" > < / >文本区域

稍微改进了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();

使用& # 10;在\n的地方,这将改变这一行。

在php工作良好反斜杠+ r (\r):

<textarea placeholder='This is a line \r this should be a new line'></textarea>

HTML

<textarea data-placeholder="1111\n2222"></textarea>

JS

$('textarea[data-placeholder]').each(function(){
    var $this = $(this),
        placeholder = $this.data('placeholder'),
        placeholderSplit = placeholder.split('\\n');
    placeholder = placeholderSplit.join('\n');
    $this.focus(function(){
        var $this = $(this);
        if($this.val() === placeholder){
            $this.val('');
            // $this.removeClass('placeholder');
        }
    }).blur(function(){
        var $this = $(this);
        if($this.val() == '') {
            $this.val(placeholder);
            // $this.addClass('placeholder');
        }
    }).trigger('blur');
});