1. ホーム
  2. ハイパーリンク

[解決済み】textareaのplaceholder属性の中に改行を挿入する?

2022-04-05 16:30:13

質問

いくつかの方法を試しましたが、どれもうまくいきませんでした。どなたか、この問題を回避する粋な計らいをご存じないでしょうか?

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

UPDATE: chromeではうまくいきません。テキストエリアの幅だけでした。

ご覧ください。 http://jsfiddle.net/pdXRx/

解決方法は?

というテキストを追加します。 value この場合、改行は無視されます。 \n .

$('textarea').attr('value', 'This is a line \nthis should be a new line');

そして、それを focus で適用し、(空の場合は)再び blur . 次のようなものです。

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ではなく、また クリーン が、うまくいく。