[javascript] 文字列を選択すると勝手にWeblioへ調べにいくブックマークレットを作ってみた

2008

04-10

18:24

[javascript] 文字列を選択すると勝手にWeblioへ調べにいくブックマークレットを作ってみた

はじめに

こちらのエントリと昨日 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;
/*--------------------------------------------------------------------------------*/
} )();

こちらもあわせてどうぞ

↑ ページの先頭へ

岩家ぶろぐ