Shoeisha Technology Media

CodeZine(コードジン)

特集ページ一覧

IEで選択した部分のソースコードを右クリックメニューで編集する(後編)

IEのコンテキストメニュー用インストーラーとソフトの作成

  • ブックマーク
  • LINEで送る
  • このエントリーをはてなブックマークに追加
2007/02/07 00:00

Internet Explorerの右クリックから開くコンテキストメニューには、HTMLと簡単なスクリプトで作成したソフトを登録することが可能です。本記事では、このコンテキストメニュー用の簡易インストーラーとソフトを作成します。後編はコンテキストメニューに登録するソフトを作成します。

目次

はじめに

 MicrosoftのInternet Explorer(以下、IE)は、パソコンのWebブラウザにおいて最大のシェアを誇っています。このソフトは、手軽に利用できるWebブラウザというだけでなく、ユーザーが必要に応じて機能追加ができるという特徴があります。その機能追加の方法の1つに、コンテキストメニュー(ブラウザ上を右クリックして表示するメニュー)へのソフトの登録があります。この方法を使うことで、自分が必要な機能をIEに追加することができます。

 コンテキストメニューに追加するソフトは、HTMLとJavaScriptの簡単な知識があれば作成できます。前編の前回は、このコンテキストメニューにソフトを追加する「コンテキストメニュー・インストーラ」を作成しました。後編の今回は「コンテキストメニュー用ソフト」という、コンテキストメニューに登録するソフトを作成します。

 以下に利用イメージを示します。

コンテキストメニューにソフト名を表示
コンテキストメニューにソフト名を表示
コンテキストメニューからソフトを起動
コンテキストメニューからソフトを起動
注意
 前回作成した「コンテキストメニュー・インストーラ」では、選択範囲の上で右クリックしたときだけ、コンテキストメニューを表示する設定にしました。そのため、それ以外の条件で右クリックを行っても、コンテキストメニューに「ソースコードを表示&削除&書き換え」という項目は表示されません。
 

過去の記事

 IEで選択した部分のソースコードを、右クリックメニューで編集する(前編)

対象読者

 JavaScriptをある程度使いこなせる人、およびHTMLに関して基本的な知識がある人を対象にしています。

 「コンテキストメニュー・インストーラ」の作成にVBScriptを使っていますが、これはユーザー変数を書き換えるだけで流用できるプログラムですので、特にVBScriptを理解していなくても、そのまま書き換えて利用することができます。もちろん、VBScriptをある程度使いこなせる人にとっては、ソースコードも参考になるでしょう。

必要な環境

 IE 4.0以上が必要です。また、Webブラウザやセキュリティ関連ソフトの設定に関しての記述も、前編の「必要な環境」で行っています。こちらも参照してください。

「コンテキストメニュー用ソフト」の作成

 以下、「コンテキストメニュー用ソフト」を作成していきます。作成は、以下の手順で進めていきます。

  1. 「source_view.html」の作成 - テキストエリアやボタンのレイアウト
  2. 変数の初期化
  3. 「選択範囲の表示」関数
  4. 「選択範囲の削除」関数
  5. 「選択範囲を書き換え」関数
  6. まとめ(完成プログラム)

「source_view.html」の作成 - テキストエリアやボタンのレイアウト

 「source_view.html」という名前の空のテキストファイルを作成します。ファイルを作成する場所は「installer.vbs」と同じフォルダである必要があります。「C:\CodeZineSample\installer.vbs」というパスに作成している場合は、「C:\CodeZineSample\source_view.html」というパスに作成してください。

 「source_view.html」を作成した後は、このファイルをテキストエディタで開いてください。まずは、HTMLを記述して、インターフェイスを作成します。以下に、「source_view.html」内に記述するHTMLの内容を示します。

ボタンやテキストエリアのレイアウト
<meta http-equiv="Content-type" 
      content="text/html; charset=Shift_JIS">
<html>
  <head>
    <title>ソースコードを表示&削除&書き換え</title>
  </head>

  <script language="JavaScript">
    // ★★★ここにソースコードを追加していく★★★

    function ViewSel () {}
  </script>

  <body leftmargin=16 topmargin=16 scroll="no" onLoad="ViewSel()">
    <small>

      <form name="f">

        ■ 選択中HTMLテキスト<br>

        <textarea name="SelHtml" rows=5 cols=63></textarea><br>
        <br>

        ■ 選択中テキスト<br>

        <textarea name="SelPlain" rows=5 cols=63></textarea><br>
        <br>

        ■ 全体HTMLテキスト<br>

        <textarea name="AllHtml" rows=5 cols=63></textarea><br>
        <br>

        ■ 全体テキスト<br>

        <textarea name="AllPlain" rows=5 cols=63></textarea><br>
        <br>

        <div align="right">
          <input type="button" value="選択範囲の削除" 
                 onClick="DelSel()">
          <input type="button" value="選択範囲の書き換え" 
                 onClick="RepSel()">
          <input type="button" value="閉じる" 
                 onClick="window.close()">
        </div>
      </form>

    </small>
  </body>
</html>

 各ボタンのonClick属性に記述してある関数は、実際にはまだ「source_view.html」内には記述されていません。この関数の中身は、以降の記事で作成していきます。

3種類のボタンと対応する関数
ボタン名 対応する関数
選択範囲の削除 DelSel()
選択範囲の書き換え RepSel()
閉じる window.close() // (windowを閉じます)

 また、bodyタグのonLoad属性に書かれたViewSel()関数は、次々章で中身を作成することになります。


  • ブックマーク
  • LINEで送る
  • このエントリーをはてなブックマークに追加

著者プロフィール

  • 柳井 政和(ヤナイ マサカズ)

    クロノス・クラウン合同会社 代表社員 http://crocro.com/ オンラインソフトを多数公開。 プログラムを書いたり、ゲームを作ったり、記事を執筆したり、マンガを描いたり、小説を書いたりしています。 「めもりーくりーなー」でオンラインソフト大賞に入賞。最近は、小説家デビューして小説...

バックナンバー

連載:IEのコンテキストメニュー用インストーラーとソフトの作成
All contents copyright © 2005-2019 Shoeisha Co., Ltd. All rights reserved. ver.1.5