人に聞けない痔の悩み、これでスッキリ >>

修行中のものです。自分のサイトをもっているのですがプラウザの Ctrl+F を知らない人がおおいいらしいのでページの頭のほうに Ctrl+F(検索)の窓を出すか、ボタンをくりっくするとCtrl+F(検索)を たちあがらせたいんですが、ご教授ください。

A 回答 (3件)

<HTML>


<HEAD>
<META http-equiv=Content-Type content="text/html; charset=s-jis">
<SCRIPT>
var ft;
function fnCallDialog(){
var oDialog = "search_dialog.htm";
ft = document.body.createTextRange();
dWin = showModelessDialog(oDialog,window,"status:no;dialogWidth:450px;dialogHeight:150px");
}
function text1_onchange() {
var c;
ft.expand("word");
if( !ft.findText(text1.value) ){
ft.moveToPoint(0,0);
ft.findText(text1.value);
return;}
ft.select();
ft.queryCommandValue("ForeColor","highlight");
ft.moveStart("word");
}
//-->
</SCRIPT>
</HEAD>
<BODY>
<P>InternetExplorer4の頃には
Find()があったみたい。<BR>現在は出来なくなったようです。<BR>でもこの機能はIE5(5.5?)ではDHTMLで可能のようです。
<BR>とりあえず作ってみたので試してね。 </P>
<P>mudmasaさんがその気になればそっくりな「検索」ダイログができるでしょう。<BR>ファイトーー!( ゜ロ゜)乂(゜ロ゜ )イッパーーツ!!</P>
<P><INPUT id=text1 style="DISPLAY: none"></P>
<P>
<INPUT id=button1 type=button value=このページを検索 name=button1 LANGUAGE=javascript onclick="return fnCallDialog()"></P>
<P></P>
<P></P>
<P></P>
<P>「このページの検索」ボタンをクリックすると</P>
<P>「編集」→「このページを検索」<BR>または、「CTRL」+「F」と似たようなダイアログが出てきます。</P>
<P>テスト用文字列です。</P>
<P>あいうえお</P>
<P>かきくけこ</P>
<P>さしすせそ</P>
<P>あいうえお</P>
<P>かきくけこ</P>
<P>さしすせそ</P></BODY></HTML>

---search_dialog.htm---
<HTML>
<TITLE>偽検索</TITLE>
<SCRIPT>
function window.onunload()
{
dialogArguments.dWin=null;
}
</SCRIPT>
<BODY bgColor=silver >
<BR>
<TABLE cellSpacing=1 cellPadding=1 width="400" border=0>
<TR>
<TD width=300>検索する文字列 <INPUT id=ip1 size="18" style="WIDTH: 143px; HEIGHT: 22px"></TD>
<TD width=100>
<INPUT onclick=dialogArguments.text1.value=ip1.value;dialogArguments.text1_onchange(); type=button size=30 value=次を検索 id=button1 name=button1 style="WIDTH: 100px; POSITION: relative; HEIGHT: 24px"></TD></TR>
<TR>
<TD width=300>
</TD>
<TD width=100><INPUT onclick=window.close(); type=button value=" キャンセル " id=button1 name=button1 WIDTH="100" HEIGHT="24" size=19 style="WIDTH: 100px; POSITION: relative; HEIGHT: 24px"></TD></TR></TABLE>
</BODY>
</HTML>
    • good
    • 0
この回答へのお礼

ス、ス、ス、スゴイ。こんなのがこんなにスラスラ出るなんて!そうですね全部教えていただいたら自分のものにならないですね。今の力は CGI | アップロードができて挿入程度は出来る。HTML | 本を見ながらタグを何とかかける  JavaScript | 本とサンプルを見ながら入れ込める。くらいですが ガンバリマス。ところでこれはDHTMLでよろしいんでしょうか?DHTMLは初挑戦ですがやってみます。

お礼日時:2002/09/24 21:27

HTMLだけではそのような機能はないようです。


No.1 で紹介されている JavaScript の find() は
IEではサポートされていません。
    • good
    • 0
この回答へのお礼

ご回答有難うございます。下記の記述をトホホさんのラウンジで見ましてhtmlで出来ると思ってしまいました、こちらにスレッドを立ててしまい申し訳ありません。ご指摘有難うございます。

<form>
<input type="button" value="Find in Page..." onclick="window.find();">
</form>

お礼日時:2002/09/24 21:06

javascriptでは下記のURLにあるように


検索窓で検索することができるようです。
(ただし、サンプルがスクリプトエラーで動作せず)

参考URL:http://www.openspc2.org/reibun/javascript/form_t …
    • good
    • 0
この回答へのお礼

早速のご回答有難うございます。確かにスクリプトエラーにはなってしまいますがヒントにさせていただきます.

お礼日時:2002/09/24 20:48

お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!

このQ&Aを見た人はこんなQ&Aも見ています

このQ&Aを見た人が検索しているワード

このQ&Aと関連する良く見られている質問

Qホームページ内検索をフォームとJavaScriptで実現したい。

簡単なホームページを作っているのですが、例えばページ内の特定のテキストを検索する場合は
Ctrl+Fで検索できますが、自分で作っているページなので、FORMとJavaScriptを使って
キーワードを formのテキストに入力し、検索ボタンを押すと、1つめのfind位置にジャンプし、
ページ内のキーワード全てに黄色の反転をさせたいのですが、可能でしょうか?
DOM?というものを詳しく知る必要があると思いますが、お勧めの書籍がありましたら教えてください。

Aベストアンサー

DOMか何かはわかりません。
ここに↓
http://mist.freespace.jp/kumisuke/bookmarklet.html
Bookmarklet という,ブラウザの「お気に入り」に登録して利用するJavaScriptが紹介されているのですが,
このページの真ん中あたりにに
「ページ内の指定テキストを強調表示(タグを壊さずそこそこ速いハイライト検索) 」
というBookmarkletがあります。

これをJavaScriptに逆輸入して,以下のようなものを作ったら,
「ページ内の指定テキストを強調表示(タグを壊さずそこそこ速いハイライト検索) 」
がボタンでできました。

-------------------------------------
<html>
<head>
<meta http-equiv="Content-Language" content="ja">
<meta http-equiv="Content-Type" content="text/html; charset=shift_jis">
<title>検索</title>
</head>

<body>
<p><INPUT type="button" value="ページ内検索"
onclick="javascript:(function(){ var d = document.body, e = prompt(&quot;&quot;, &quot;&quot;); d.innerHTML = d.innerHTML.replace(RegExp(&quot;&gt;[^&lt;]*(?:&quot;+e+&quot;)[^&lt;]*&lt;&quot;, &quot;ig&quot;),function(a){ return a.replace(RegExp(e, &quot;ig&quot;), '&lt;span style=&quot;color:Black;background:Yellow;&quot;&gt;$&amp;&lt;/span&gt;'); }); })()"></p>
<p>あいうえお<br>
かきくけこ<br>
さしすせそ</p>
</body>
</html>
------------------------------------

javascript:(function ~~ の部分は改行されているように見えますが一行です。

DOMか何かはわかりません。
ここに↓
http://mist.freespace.jp/kumisuke/bookmarklet.html
Bookmarklet という,ブラウザの「お気に入り」に登録して利用するJavaScriptが紹介されているのですが,
このページの真ん中あたりにに
「ページ内の指定テキストを強調表示(タグを壊さずそこそこ速いハイライト検索) 」
というBookmarkletがあります。

これをJavaScriptに逆輸入して,以下のようなものを作ったら,
「ページ内の指定テキストを強調表示(タグを壊さずそこそこ速いハイライト検索) 」
がボタン...続きを読む

QJavaScriptでショートカットキーを実行

JavaScriptでショートカットキーの実行は可能でしょうか?
たとえば、IEのブラウザ上でCtrl+Pと同様の動きを実現したいと思います。


よろしくお願いいたします。

Aベストアンサー

先ほどの補足ですが、window.print()以外で印刷を実行するには
私の知っている範囲内ではIEオブジェクトの(ExecWB)を使う事くらいです。

参考例↓
http://msdn.microsoft.com/en-us/library/aa752084(VS.85).aspx
http://msdn.microsoft.com/en-us/library/ms691264(v=VS.85).aspx

ただし、IEオブジェクトを使用するにはちょっとした小細工が必要です。
調べてみてください。

Qページ内のみの検索窓(?)

ホームページ上から指定のファイルをダウンロードすることが出来るようにページを作ろうかと思っています。イメージとしては、商品のマニュアルダウンロードと言えばわかりやすいでしょうか。
商品名をクリックすると指定のpdfファイルがDL出来るようにする物です。
ただ、ファイルが1000個程度になりそうなので指定のファイルをすぐ探し出すのは困難です。
そこで、そのページ上だけを検索してヒットした場所に移動するようにするにはどうしたら良いでしょうか?
いわゆるブラウザの「検索」機能ですが、出来るだけわかりやすいようにページ上での入力で表現したいと思います。
------------------------
□□□□□□□□ [検索]

商品名1 [Download]
商品名2 [Download]
商品名3 [Download]
~~
-------------------------
こんな感じです。

何か良い方法はありませんか?
お願いします。

Aベストアンサー

<script language="JavaScript">
<!--
var Nsc4 = (document.layers);
var Ie4 = (document.all);

var win = this;
var n = 0;

function seek_str(str) {
var txt, i, found;
if (str == ""){
alert("なにか文字をいれてください。");
return false;
}
if (Nsc4) {
if (!win.find(str)){
while(win.find(str, false, true)){
n++;
}
}else{
n++;
}
if (n == 0){alert(str + " は見つかりませんでした。");}
}
if (Ie4) {
txt = win.document.body.createTextRange();
for (i = 0; i <= n && (found = txt.findText(str)) != false; i++) {
txt.moveStart("character", 1);
txt.moveEnd("textedit");
}
if (found) {
txt.moveStart("character", -1);
txt.findText(str);
txt.select();
txt.scrollIntoView();
n++;
}else{
if (n > 0) {
n = 0;
seek_str(str);
}else{
alert(str + " は見つかりませんでした。");
}
}
}
return false;
}
//-->
</script>

以上でページ内検索ができるようになると思います。
ただし、Opera7.23ではリロードするだけで正常に
動作しません。Operaでは動作しないように、または
表示させないようにするスクリプトを追加する方が
いいでしょう。

実際にはブラウザの検索機能があるのでそれほど
気にすることはないと思いますが、ある程度
カテゴリ分けをしておくことやおいうえお順に
整理しておくなどするとよいと思います。

<script language="JavaScript">
<!--
var Nsc4 = (document.layers);
var Ie4 = (document.all);

var win = this;
var n = 0;

function seek_str(str) {
var txt, i, found;
if (str == ""){
alert("なにか文字をいれてください。");
return false;
}
if (Nsc4) {
if (!win.find(str)){
while(win.find(str, false, true)){
n++;
}
}else{
n++;
}
if (n == 0){alert(str + " は見つかりませんでした。");}
}
if (Ie4) ...続きを読む

Q同一ページ内で、任意の文字列検索→検索にヒットした
  • 要素を表示(それ以外は非表示)させる方法
  • 表題の通りなのですが、javascriptなどで実現可能でしょうか?

    http://g5187066.k-free.net/
    【ソース】
    <body>
     <div>
      <input type="text">
      <input type="submit" value="検索">
     </div>
     <ul>
      <li>あいうえお</li>
      <li>かきくけこ</li>
      <li>さしすせそ</li>
      <li>たちつていうえと</li>
      <li>なにぬねの</li>
     </ul>
    </body>

    上記のようなhtmlページがあり、例えば
    「いうえ」とフォームから検索したら1番目の<li>要素と4番目の<li>要素が表示され、そのほかの<li>要素は hidden になるようなイメージです。

    ヒットする文字列を含む<li>要素以外にjavascriptでクラスを付与させ、そのクラスのスタイルに display:none; などのスタイルを当てることで実現できそうな気はするのですが、どう書けばよいのか全然わからず、もしもご存知の方がいらっしゃいましたらご教授いただければ非常に助かります…

    もしくは上記のようなことが実現できるjqueryのプラグインなどが存在するのであればこちらもご教授いただければ非常に助かります…

    結構探したのですが見つかりませんでした。。(>_<)

    表題の通りなのですが、javascriptなどで実現可能でしょうか?

    http://g5187066.k-free.net/
    【ソース】
    <body>
     <div>
      <input type="text">
      <input type="submit" value="検索">
     </div>
     <ul>
      <li>あいうえお</li>
      <li>かきくけこ</li>
      <li>さしすせそ</li>
      <li>たちつていうえと</li>
      <li>なにぬねの</li>
     </ul>
    </body>

    上記のようなhtmlページがあり、例えば
    「いうえ」とフォームから検索したら1番目の<li>要素と4番目の<li>要素が表示され、その...続きを読む

    Aベストアンサー

    エンターはsubmitですからねぇ・・・
    trimなど一部仕様外を含めバグっていたのをなおして
    こんな感じでどうでしょうか?

    <style>
    li.hide{display:none;}
    </style>
    <script>
    try{
    document.addEventListener('keypress',function(e){pressfunc(e)},true);
    }catch(e){
    document.attachEvent('onkeypress',function(e){pressfunc(e)});
    }
    function pressfunc(e){
    var t = (e.srcElement || e.target);
    if(e.keyCode==13 && t.name=="keyword"){
    searchword();
    if(e.preventDefault){
    e.preventDefault();
    }else{
    e.returnValue=false;
    }
    }
    }
    function searchword(){
    var v=document.getElementById("keyword").value;
    var n1=document.getElementById("wordlist");
    var n2=n1.getElementsByTagName("li");
    for(var i=0;i<n2.length;i++){
    var cn=n2[i].className;
    cn=cn.replace(/(^|\s)hide(\s|$)/,"");
    if(! n2[i].innerHTML.match(new RegExp(v))){
    n2[i].className=(cn+(cn==""?"":" ")+"hide");
    }else{
    n2[i].className=cn;
    }
    }
    }
    </script>
    <form>
    <input type="text" name="keyword" id="keyword" value="いうえ">
    <input type="button" value="検索" onclick="searchword()">
    </form>
    <ul id="wordlist">
    <li>あいうえお</li>
    <li>かきくけこ</li>
    <li>さしすせそ</li>
    <li>たちつていうえと</li>
    <li>なにぬねの</li>
    </ul>

    エンターはsubmitですからねぇ・・・
    trimなど一部仕様外を含めバグっていたのをなおして
    こんな感じでどうでしょうか?

    <style>
    li.hide{display:none;}
    </style>
    <script>
    try{
    document.addEventListener('keypress',function(e){pressfunc(e)},true);
    }catch(e){
    document.attachEvent('onkeypress',function(e){pressfunc(e)});
    }
    function pressfunc(e){
    var t = (e.srcElement || e.target);
    if(e.keyCode==13 && t.name=="keyword"){
    searchword();
    if(e.preventDefault){
    e.preve...続きを読む

    Q"ctrl" + "f" を、ボタンを押して起動できるようにしたい

    "ctrl" + "f" で起動するページ内検索を知らない人でもできるように、ページ内のボタンを押して起動できるようにしたいのですが、やり方が見つかりません。たぶんjava scriptを使うと思うんですが。どなたかいいやり方があったら教えてください。

    Aベストアンサー

    IE(Win)のみで使えるやり方ですけど、
    (多分IEでの話だと思いますので)
    <script languege="JScript">
    <!--
    function showSearch(){
    var objWsh = new ActiveXObject("WScript.Shell");
    objWsh.SendKeys("^f");//objWsh.SendKeys("%EF");
    }
    //-->
    </script>

    <button onclick="showSearch()">検索</button>

    QJavaScript でキーを送る

    JavaScript でキーを送る
    のはどうしたらいいのでしょうか。
    キーボードからではなく、自動的に任意のキーを押させたいのです。


    // aキーのkeydownイベントを起こす
    var _e = document.createEvent("KeyboardEvent");

    _e.initKeyEvent("keydown", true, true, null, false, false, false, false, 65, 0);
    document.getElementById("dummy").dispatchEvent(_e);

    いろいろ検索して上記のも試しましたが、IE8では動作が確認できませんでした。
    IEじゃ無理なんでしょうか。

    Aベストアンサー

    よくわかんないけど…

    どうせIEは独自仕様だろうと、少し調べてみました。
    どうやらこれらしい。(↓)
    http://msdn.microsoft.com/ja-jp/library/ms536423(en-us,VS.85).aspx

    手元にIE6しかないので、IE6でのみ確認。
    <html>
    <head><title>test</title>
    <script type="text/javascript">
    function test(evt) {
    var e = evt.srcElement;
    alert(e.tagName + ' / ' + evt.keyCode);
    }

    function fire() {
    var obj = document.createEventObject();
    obj.keyCode = 65;
    document.body.fireEvent("onkeydown", obj);
    }
    </script>
    </head>
    <body onkeydown="test(event)">
    <input type="button" value="発生" onclick="fire()">
    </body>
    </html>

    >キーボードからではなく、自動的に任意のキーを押させたいのです。
    でもkeydownそのものをシュミレートしなくてもよさそうな気もしますが…?(その結果のほうを実行/操作すればよさそう)

    よくわかんないけど…

    どうせIEは独自仕様だろうと、少し調べてみました。
    どうやらこれらしい。(↓)
    http://msdn.microsoft.com/ja-jp/library/ms536423(en-us,VS.85).aspx

    手元にIE6しかないので、IE6でのみ確認。
    <html>
    <head><title>test</title>
    <script type="text/javascript">
    function test(evt) {
    var e = evt.srcElement;
    alert(e.tagName + ' / ' + evt.keyCode);
    }

    function fire() {
    var obj = document.createEventObject();
    obj.keyCode = 65;
    document.body.fireEvent("on...続きを読む

    Qテーブルタグの中にdivを含めてはダメ?

    テーブルタグの中にdiv要素を入れるとダメなのでしょうか?
    何か不都合でもあるのでしょうか?
    何かご存知の方がいれば教えていただけませんか?

    Aベストアンサー

    以下、HTML 4.01での話です。(XHTMLでもほぼ同じだと思います)

    tableタグ直下に書けるのは、caption,col,colgroup,head,tfoot,tbodyと定義されています。
    特定の条件下でtbodyが省略できますので、実際はtrも書けます。これら以外は書けないことになっています。
    tr直下にはth,tdが書けることになっています(それ以外は不可)。

    th,tdの下にはブロック要素が書けるので、divも書けます。

    このように、テーブル内でth,tdの中以外でdivが使えないのはHTMLの仕様でそう決まっているからです。

    Qテーブル内の文字サイズを変更したい。

    HTMLのテーブル内の文字サイズを変更したいのですが。
    イマイチ上手くいかずに悩んでいます。
    出来れば全体的に<TABLE></TABLE>のほうでいじれますか?
    <TD>タグや<TR>タグのところでいじくるのですか?

    Aベストアンサー

    いろいろやり方はありますが
    文字単位でサイズを変更するには
    #2の方法ですね。

    テーブルごとやセル(<TD>)ごとにサイズを変更するには
    スタイルシート(CSS)を使用します。

    テーブルごとにサイズを変更する場合
    <TABLE style="font-size : 20px;">

    セル(<TD>)ごとにサイズを変更する場合
    <TD style="font-size : 20px;">あああ</TD>

    #1の方法だとページ内の全てのセル(<TD>)に設定することになります。

    スタイルシート(CSS)はこれら以外にも
    いろいろな設定方法があります。

    Qサイト内にページ内検索の設置方法

    現在のHPにサイト内検索の機能を追加したいと考えています。簡単に設置出来る方法をご存じでしたら教えていただけないでしょうか?よろしくお願いします。

    Aベストアンサー

    大きく分けて、

    1,検索ポータルサイトのサイト内検索サービスを使用する。(Goo、Googleなど)

    2,CGIプログラムを使用する。

    3,インデックス型の検索エンジンを導入する。

    簡単さを求めるならば1でしょうか。
    http://tohoho.wakusei.ne.jp/www.htm
    のサイトに検索フォームの解説があるので一読してみてはいかがでしょうか。

    QonClickに複数の関数を挿入する方法

    初心者なのですがアニメーションの関数anime1、anime2、anime3を作成し、onClickに下記のように設定しました。
    クリックするとアニメーション2つの設定ではは動くのですが、3つ目を設定すると動かなくなります。
    通常はこのような設定はしないものなのでしょうか?
    教えてください。
    よろしくお願いします。
    <INPUT type="button" value="START" onClick="anime1(), anime2()">・・・OKです。
    <INPUT type="button" value="START" onClick="anime1(), anime2(),anime3()">・・・動きません。

    Aベストアンサー

    セミコロンでつなぐのが常道ですが、3つ以上なら
    別途function化したほうが、可読性が高くなると
    思います。


    このQ&Aを見た人がよく見るQ&A

    人気Q&Aランキング