jqueryでtextareaに書かれた文字の改行を消して違うtextareaに表示する方法

jqueryを使って改行された文字の改行を消す方法をご紹介したいと思います。

jqueryを使って改行を消すには、まず対象の文字を取得してきて改行コードでspiltさせ、その後splitさせた文字をそのまま出力するという形で改行コードを消したいと思います。

jqueryでtextareaに入力された文字の改行を消して他のテキストエリアに表示する方法

<textarea id="kaigyo" name="kaigyo">
この文字は
改行されています
改行消してください
</textarea>
<script>
$(function(){
  var val=$('#kaigyo').val();
  var split=val.split(/\r\n|\r|\n/);
  var temp='';
  for(var i=0;i<split.length;i++){
     temp+=split[i];
  }
  $('#result').val(temp);
});
</script>

考え方としては、まずjqueryで改行を消したいエリアの値を取得します。

その後splitを使用して、改行コードで分割します。分割後の文字をforで回して１つずつ文字列を後ろに追加していきその変数を結果のエリアに表示させることで改行を消すことに成功しています。

実装サンプル

コピー元のtextarea

改行が消えたtextarea

まとめ

jqueryを使ってtextareaに入力された文字の改行を消す方法についてご紹介させていただきました。入力された文字の前後に何か代入したり、応用が効くと思います。

何かの参考になれば幸いです。