WEBページ制作

WEBページ制作の話題に関するフォーラムです。
  • 掲示板への投稿には会員登録(無料)が必要です。会員登録がまだの方はこちら
  • 掲示板ご利用上のお願い」に反するご記入はご遠慮ください。
  • Q&A掲示板の使い方はこちらをご覧ください
トピックに返信
質問

 
(Windows 10 Pro : HTML)
メッセージを複数行に改行したい
投稿日時: 20/02/20 15:04:06
投稿者: takatada72

先日、こちらのサイトで教えて頂いた下記内容を 拡張したいと思い投稿させて頂きました。
ボタンを押して、テキストボックスに記載されている内容をクリップボードにコピーさせた
いのですが、一行でいけるものはいいのですが、文章のようなものは、複数行になるよう
コピーしたいのです。
 
下記の例では、
「いつもお世話になっております。 下記ご連絡頂きましてありがとうございました。」
で1行なのですが、
 
こちらのように複数行でコピーするには、どのようにタグを追加すれば良いのでしょうか
宜しくお願い致します。
 
「いつもお世話になっております。
 
下記ご連絡頂きましてありがとうございました。」
 
<!-- 挨拶分をコピー -->
  <button onclick="copyToClipboard('copyTarget1')">挨拶文1</button>
  txt="いつもお世話になっております。 下記ご連絡頂きましてありがとうございました。"
  <input id="copyTarget1" type="text" value=txt readonly>
  

回答
投稿日時: 20/02/24 12:12:48
投稿者: hatena
投稿者のウェブサイトに移動

<input id="type="text"> では1行しか入力できません。
複数行入力する場合は、<textarea>を使います。
 

<!-- 挨拶分をコピー -->
  <button onclick="copyToClipboard('copyTarget1')">挨拶文1</button>
  txt="いつもお世話になっております。 下記ご連絡頂きましてありがとうございました。"
<textarea id="copyTarget1" cols="50" rows="3" readonly>
いつもお世話になっております。
 
下記ご連絡頂きましてありがとうございました。
</textarea>

  <script>
    function copyToClipboard(Target) {
      // コピー対象をJavaScript上で変数として定義する
      var copyTarget = document.getElementById(Target);

      // コピー対象のテキストを選択する
      copyTarget.select();

      // 選択しているテキストをクリップボードにコピーする
      document.execCommand("Copy");

      // コピーをお知らせする
      alert("コピーできました! : " + copyTarget.value);
    }
  </script>

トピックに返信