はじめに
こちらのエントリ と昨日 in-box (GTD的な意味で) に入れたメモにインスパイアされて,ちょっと作ってみました.
何を?
Webページ上の任意のテキストをマウスで選択すると,勝手に Weblio を新しいウィンドウ or タブで開いてその文字列について調べにいく,というアクションを起こすためのブックマークレットです.
まずはお試し
1.JavaScript を読み込む
次のリンクをクリックすることで,先に書いたアクションを起こすための JavaScript を読み込みます.
Select’n'Search!
2.任意のテキストを選択する
本エントリの適当な文字列をマウスドラッグで選択します.この段階では,マウスのボタンは押したままにしていてください.
3.Controlキーを押したままマウスボタンをはなす
Controlキーを押し,そのままの状態でマウスボタンをはなします.
要は,マウスボタンをはなすときに Controlキーが押されている状態であればOKです.
4.Weblio が開く
選択した文字列についての Weblio のページが開きます.
ブックマークレットとして使う
先のリンクをブックマークレットとして登録することで,任意のページのテキストについて同様のことができるかと思います.
その他
現在,Opera 9,Firefox 2,Safari 3 にて動作を確認しています.また,Internet Explorer 6 で動作しないことも確認しています.
また,フレームを越えた文字列については対応していません.(ですが,希望のフレームをアクティブにした後にブックマークレットを実行することで解決するかもです.)
選択文字列の取得方法については以下を参考にしていますので,詳細はそちらをご覧ください.
岩家ぶろぐ » [javascript] bookmarklet で選択文字列を取得する件で
おわりに
言葉を調べたりする際のほんのちょっとしたツールとなれば幸いです.
また,行き先を Weblio から他のサイトに変えてみることで別の使い方ができるかも,です.
おまけ: ソースコード
ブックマークレット実行時に読み込むJavaScriptのソースコードを以下に示しておきます.
( function() {
/*--------------------------------------------------------------------------------*/
var d = document;
/**
*
* jQuery のロードを開始する
*
**/
if( typeof jQuery == 'undefined' ) {
var e = d.createElement( 'script' );
e.type = 'text/javascript';
e.src = 'http://iss.ms/js/lib/jquery-1.2.3.pack.js';
e.charset = 'utf-8';
d.body.appendChild( e );
}
/**
*
* 以下,jQuery がロードされた後に実行される関数
*
**/
var jQueryLoaded = function() {
var b = $( d.body ); // body
b.mouseup( function( e ) {
var text = getSelection();
if( e.ctrlKey && text ) {
window.open( 'http://www.weblio.jp/content/' + text, 'iss.ms/selectnsearch' );
}
} );
/**
*
* 選択文字列を取得する
*
*
**/
var getSelection = function() {
return getSelectedText( window ) || '';
function getSelectedText( w ) {
var t = '';
try {
t = w.getSelection().toString();
} catch(e) {
return;
}
if( t ) {
return t;
} else {
var ties = getTextInputElements( w );
for(var i = 0; i < ties.length; i++ ) {
var tie = ties[i];
var s = tie.selectionStart;
var e = tie.selectionEnd;
if( s != e ) {
return tie.value.substr( s, e-s );
}
}
}
return t;
}
function getTextInputElements( w ) {
var elms = w.document.getElementsByTagName( '*' );
var ties = [];
for( var i = 0, e; e = elms[i]; i++ ){
var tag = e.tagName.toLowerCase();
if( tag == 'textarea' ) {
ties[ties.length] = e;
} else if( tag == 'input' ) {
var ty = e.type.toLowerCase();
if ( !ty || ty == 'text' ) {
ties[ties.length] = e;
}
}
}
return ties;
}
};
};
/**
*
* jQuery がロードされるまで待機
*
*/
var wait4jQuery = function() {
if( typeof( jQuery ) == 'undefined' ) { setTimeout( wait4jQuery, 0 ); }
else { jQueryLoaded(); }
};
wait4jQuery();
return;
/*--------------------------------------------------------------------------------*/
} )();