Help us understand the problem. What is going on with this article?

IEでコピーツールを作る

More than 1 year has passed since last update.

はじめに

メモ帳やエクセルに書いてあるデータをコピペしまくる事、よくあります。でもちょっと使いにくい部分も…

  • メモ帳の場合、範囲選択がめんどくさい※ダブルクリックしても思うような範囲選択にならないことも…
  • エクセルだとテキストをコピーしたいのにセルがコピーされちゃってややこしいことになったり…
  • そもそもCtrl + cを押したくない…

クリックするだけでコピーできるツールがあると作業がはかどりそう!と思って作ってみました。

IEで実装してみる

index.html
<!DOCTYPE html>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>コピーテスト</title>

<style>
    table {
        border-collapse: collapse;
    }

    td {
        border: 1px solid #aaa;
        padding: 1rem;
        cursor: pointer;
    }
</style>

<table>
    <tr>
        <td>あいうえお</td>
        <td>かきくけこ</td>
    </tr>
    <tr>
        <td>さしすせそ</td>
        <td>たちつてと</td>
    </tr>
</table>

<script>
    (function () {
        var i,
            td = document.getElementsByTagName("td"),
            color1 = "black",
            color2 = "red";

        for (i = 0; i < td.length; i++) {
            td[i].style.color = color1;

            td[i].addEventListener('click', function () {
                window.clipboardData.setData("text", this.innerHTML);

                if (this.style.color == color1) {
                    this.style.color = color2;
                } else {
                    this.style.color = color1;
                }

            }, false);

        }

    }());
</script>

コピーしたい文字をクリックすると文字色が反転し、コピーされます。我ながら結構使いやすいです。文字を動的に変化させると色々なコピペツールが作れそうです。IE以外のブラウザでは動かないのが残念なので、後日エクセルVBAやElectronでの実装も行ってみます(^^)

sozaiya
よろしくお願いします ^^) _旦~~
Why not register and get more from Qiita?
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away
Comments
No comments
Sign up for free and join this conversation.
If you already have a Qiita account
Why do not you register as a user and use Qiita more conveniently?
You need to log in to use this function. Qiita can be used more conveniently after logging in.
You seem to be reading articles frequently this month. Qiita can be used more conveniently after logging in.
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away
ユーザーは見つかりませんでした