CSS・Javascriptでの質問です。


複数段にわたるものをコピーして、各段をことなるテキストボックスにペーストするということは可能でしょうか?

1段目のコピー
2段目のコピー
3段目のコピー
上記3段を選択してコピーして、下記のテキストボックスに一度のペーストでするというものです。
<input type="text" name="1">
<input type="text" name="2">
<input type="text" name="3">
本来であれば、各段をコピーしてペーストという作業を3回ずつ行わなければなりませんが、一度で済ますことが可能であればと効率があがると考えました。

そもそもこういった操作が可能なのかどうかもわからないのですが、可能であれば手法や関数についてアドバイスいただけると助かります。

回答の条件
  • 1人5回まで
  • 登録:
  • 終了:2012/02/09 19:31:26
※ 有料アンケート・ポイント付き質問機能は2023年2月28日に終了しました。

ベストアンサー

id:Cherenkov No.1

回答回数1504ベストアンサー獲得回数493

ポイント100pt

javascriptだけではクリップボードを使ってコピーペーストできません。
(flashを経由する方法もあります。最新のブラウザならいけるのかも)
以下のような考えでどうでしょうか。
http://jsfiddle.net/cherenkov/pH5wc/

<html>
<head>
<meta charset="utf-8">
</head>
<body>
<input type="button" id="btn" value="output"><br>
<input type="text" name="1"><br>
<input type="text" name="2"><br>
<input type="text" name="3"><br>
<textarea id="output"></textarea>
<script>
document.getElementById('btn').addEventListener('click', function() {
  document.getElementById('output').value = document.getElementsByName('1')[0].value +'\n'+ document.getElementsByName('2')[0].value +'\n'+ document.getElementsByName('3')[0].value;
}, false);
</script>
</body>
</html>

何の目的でコピペしたいのでしょうか?quocardさん個人で使いたいシステムでユーザースクリプト等を使ってもいいですか?(拡張ならコピペが可能)
入力フォームの内容をテキストボックスに出力することは可能ですが、
シチュエーションがわからないと適切な回答ができません。

-----------

追記

上のは質問を正しく解釈していませんでした、失礼。
これでどうでしょう。選択文字列を取得するのに苦労するのでjQueryと以下のプラグインを使いました。

選択範囲のテキストを操作するjQueryプラグインjQuery.selection - 今日も適当ダイアリー


http://jsfiddle.net/cherenkov/pH5wc/2/

<html>
<head>
<meta charset="utf-8">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js" type="text/javascript"></script>
<script src="http://www.weekendphp.com/jQuery/jquery.selection-min.js" type="text/javascript"></script>
<script>
$(function() {
  $('#btn').click(function() {
    var selectText = $.getSelection('html').split('\n');
    $('[name="1"],[name="2"],[name="3"]').each(function(i, e){
      $(this).val(selectText[i]);
    });
  });
});
</script>
</head>
<body>
<pre>
1段目のコピー
2段目のコピー
3段目のコピー
</pre>
<input type="button" id="btn" value="output"><br>
<input type="text" name="1"><br>
<input type="text" name="2"><br>
<input type="text" name="3"><br>
</body>
</html>
他2件のコメントを見る
id:quocard

回答ありがとうございます。

説明不足ですいませんでした。
実際の作業としては、別のテキストにあるものをコピーペーストでテキストボックスにいれたいのですが、数が多いのである程度まとめてコピーペースト出来ればと考えておりました。
教えていただいた方法についてこれからちょっと試してみようと思います。

2012/02/08 09:27:20
id:Cherenkov

「別のテキスト」も含めたHTMLを提示すればよりよい回答がつくかもしれません。
さらにカイゼンするなら、mouseupイベントハンドラを使えば、文字列を選択し終わると同時にテキストボックスに入力できたりします。

2012/02/08 09:43:32

コメントはまだありません

この質問への反応(ブックマークコメント)

「あの人に答えてほしい」「この質問はあの人が答えられそう」というときに、回答リクエストを送ってみてましょう。

これ以上回答リクエストを送信することはできません。制限について

回答リクエストを送信したユーザーはいません