※Make Link ジェネレータを作ったのでそちらも参照してみてください。
Google Chrome で使う Make Link の代用ブックマークレットのジェネレータ

Google Chrome で使う Make Link の代用ブックマークレット vol.2 のブックマークレットを少し改良した。

以前から引き継いでいる処理内容や使い方を知りたい場合は参照のこと。

改良点

コピーのイベントを受け取るとコピー後に textarea のタグを消去する処理を追加。

これで、クリックと 『Ctrl + C』 と textarea 消去がほぼ同時に行えるのでストレスがまったくなくなった。クリックするだけでコピーできる感覚。

処理

処理内容は以下。

var ele = document.createElement("textarea");
ele.style.width = "100%";
ele.value ='<a href="'+window.location.href+'">'+document.title+'</a>';
document.body.insertBefore(ele,document.body.firstChild);
ele.focus();
ele.select();
ele.ondblclick = function(){ele.parentNode.removeChild(ele);
ele.oncopy = function(){
    setTimeout(function(){
        ele.parentNode.removeChild(ele);
    },
    1);return%20true;
};

【8行目】
コピーのイベントを受け取ると setTimeout() でイベントを生成し textarea のタグを消去。

その他の処理は下記を参照
Google Chrome で使う Make Link の代用ブックマークレット vol.2

ブックマークレット

Make Link
ドラッグ&ドロップでブックマークのツールバーまで持っていけばOK。

javascript:(function(){var%20ele=document.createElement("textarea");ele.style.width="100%";ele.value='<a%20href="'+location.href+'">'+document.title+'</a>';document.body.insertBefore(ele,document.body.firstChild);ele.focus();ele.select();ele.ondblclick=function(){ele.parentNode.removeChild(ele);};ele.oncopy=function(){setTimeout(function(){ele.parentNode.removeChild(ele);},1);return%20true;}})()

おまけ

最初は下記の処理で試したが textarea がクリップボード格納前に消去さてしまうからかコピーできなかった。

ele.oncopy = ele.parentNode.removeChild(ele);return%20true;

oncopy のイベントが完了した後にイベントが発生しないか調べていると JavaScript : onBeforeCopy というのを見つけて、onAfterCopy みたいなのがないかと調べたけど見つけられなかった。

oncopy 内で完了イベントを生成して完了後に呼び出そうとか考えて、addEventListener を試してみたけど自分が想像していたのとなんか違ってた。(処理的には同じもの?)
※この時は setTimeout() を使うのがなんとなくいやだった。理由は特にあるかと聞かれるとない。気分的な問題。

ちなみに、このときに下記の処理を試してみると addEventListener → oncopy の順で呼び出されていた。

var ele = document.createElement("textarea");
ele.style.width = "100%";
ele.value ='<a href="'+window.location.href+'">'+document.title+'</a>';
document.body.insertBefore(ele,document.body.firstChild);
ele.focus();
ele.select();
ele.ondblclick = function(){ele.parentNode.removeChild(ele);
ele.oncopy = function(){alert("oncopy");return%20true;};
ele.addEventListener('copy',function(){
    alert("addEventListener");return%20true;
},true);

addEventListener 実験

最終的に setTimeout() に落ち着く。前述の【処理】へ。

参照

今回の処理とは関係ないものも含まれているが参考にしたもの。

javascriptのaddEventListener関数について – Yahoo!知恵袋
DOM:element.oncopy、oncut、onpaste を翻訳 – A Better Project@はてなダイアリー
Javascriptでイベントハンドラのコールバック関数に引数を渡す – yummy-yummy
イヌでもわかるJavaScript講座
setTimeout/JavaScriptリファレンス
404 Blog Not Found:javascript – ページはいつ再描画されるか

トラックバック一覧

この記事にはトラックバックがついていません。

コメント一覧

  1. これがいいですよ。
    Create Link – Google Chrome 拡張機能ギャラリー
    https://chrome.google.com/extensions/detail/gcmghdmnkfdbncmnmlkkglmnnhagajbm

    コメント:あんま | 2010/03/22 月曜日 19:15

  2. Create Link がリリースされてからは、Make Link の代用品としての役目は終えたと思っています。

    Google Chrome 拡張機能の Chrome Keyconfig がいい に書きましたが、個人的には Chrome Keyconfig と Make Link ジェネレータ を組み合わせて使うと Create Link より使い勝手がいいんです。この辺は好みの問題だと思いますが。

    ほどほどにショートカットキーを使う人ならこっちの方が使い勝手がいいと思う人もいるんじゃないかなーという感じです。

    とは言え、多くの人が Create Link の方が使いやすいのは間違いないと思います。

    コメント:zon | 2010/03/23 火曜日 11:08

RSS feed for comments on this post.

コメント投稿

Sorry, the comment form is closed at this time.