JavaScriptによるページ内検索での検索方向

このQ&Aのポイント
  • JavaScriptを使ったページ内検索で検索方向を変更する方法について教えてください
  • 自分のサイトにページ内検索を追加しましたが、検索方向が制限されています。上から下だけでなく下から上へも検索できるようにする方法を教えてください
  • JavaScriptに関して知識が乏しく、ページ内検索の検索方向をどのように変更すれば良いか分かりません。検索方向の記述箇所や具体的な変更方法について教えてください
回答を見る
  • ベストアンサー

JavaScriptによるページ内検索での検索方向

こんにちは、JavaScriptを使ったページ内検索についての質問です。 http://computer.shipweb.jp/soft/pageinserch.htm こちらのサイト様を参考に、自分のサイトにページ内検索をつけ正常に作動はしましたが、 検索方向が「上から下」の一方のみになっています。 これを「下から上」方向へも検索出来ないかと考えているのですが、 JavaScriptに関してほぼ無知に近い為何をどう変えれば良いのかわからず困り果てております; 検索方向の記述がどこの部分なのか、出来ればどう変えれば良いのかも、 分かる方がいらっしゃいましたらご教授お願い致します。

質問者が選んだベストアンサー

  • ベストアンサー
  • my--
  • ベストアンサー率89% (91/102)
回答No.2

だめでしたか。 2方向の件は最初の質問内容をいい加減に読んだこちらのミスです。 申し訳ありません。 承知の上で使ってると思いますけど、要素名や属性まで検索の対象になるのは使い勝手が悪そう。 ブラウザが備える機能を補うものでないと意味はないかなと個人的には思います。 一応検証に使ったソースコードを置いておきますが、これもいい加減です。あくまで参考程度にして下さい。 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html lang="ja"> <head> <meta http-equiv="Content-Type" content="text/html; charset=shift_jis"> <meta http-equiv="Content-Script-Type" content="text/javascript"> <title>サンプル</title> <script type="text/javascript"> var serchindex = -1;//ココ var serchcounter = 0; var serchstr = ""; var serchwordcounter = 0; var start = 0; var dir = ""; function wordserch() { var radio = document.parts.radio1; for (var n = 0; n < radio.length; n++) { if (document.parts.radio1[n].checked) { if (dir != document.parts.radio1[n].value) { dir = document.parts.radio1[n].value; serchindex = (dir == "down") ? 0 : -1; } break; } } var s = document.parts.text1.value; if (s != serchstr) { serchindex = (dir == "down") ? 0 : -1;//ココ serchstr = s; serchwordcounter = 0; } var bCrumb = new Array(); var i; while (serchstr.indexOf(' ') >= 0) { serchstr = serchstr.replace(" ", " "); } while (serchstr.indexOf('|') >= 0) { serchstr = serchstr.replace("|", " "); } while (serchstr.indexOf('&') >= 0) { serchstr = serchstr.replace("&", " "); } bCrumb = serchstr.split(" "); for (i = serchwordcounter; i < bCrumb.length; i++) { serchstring = bCrumb[i]; serchcounter++; ref = serch(serchstring); if (!ref) { alert('検索単語が見つかりません'); } if (ref == true && start >= 0) { break; } else if (ref == true && start < 0) { serchwordcounter++; serchindex = (dir == "down") ? 0 : -1;//ココ break; } else { serchwordcounter++; serchindex = (dir == "down") ? 0 : -1;//ココ } } } function serch(txt, index) { var before, after, objstr; kazu = 0; serchstr = txt; objct = document.getElementById('UR'); str = objct.innerHTML; if (serchindex < 0) serchindex = str.length;//ココ if (dir == "down") { start = str.indexOf(serchstr,serchindex);//ココ } else { start = str.lastIndexOf(serchstr, serchindex); } if (start > 0) { before = str.substring(0, start); txt = "<B><A NAME='serchstr" + serchcounter + "'>" + serchstr + "</A></B>"; after = str.substring(start + serchstr.length); objstr = before + txt + after; objct.innerHTML = objstr; location.hash = "#serchstr" + serchcounter; serchindex = (dir == "down") ? start + txt.length : start;//ココ return true; } else { return false; } } </script> </head> <body> <form name="parts" action="#"> <div><input type="text" name="text1"> <input type="button" onclick="wordserch()" value="検索"> <input type="radio" name="radio1" value="down" checked>down <input type="radio" name="radio1" value="up">up </div> </form> <div id="UR">~</div> </body> </html>

seven9317
質問者

お礼

再度のご回答とご確認ありがとうございます。 貼って頂いたソースできちんと動作しました! 要素名や属性の件ですが、 自サイトがアイテムデータサイトとなっておりまして、 検索対象が全て日本語(ひらがな・カタカナ・漢字、稀に数字)ですので そこらへんは大丈夫かなと思います。 ご教授頂き本当にありがとうございました。

その他の回答 (1)

  • my--
  • ベストアンサー率89% (91/102)
回答No.1

str = objct.innerHTML; if (serchindex < 0) serchindex = str.length;//ココ start = str.lastIndexOf(serchstr, serchindex);//ココ if (start > 0) { まずココを。それから先頭行の var serchindex = -1;//ココ あといくつか serchindex = 0 がありますけど そこもすべて-1を代入します。最後に serchindex = start;//ココ 最終行近くにあるココを書き換えてみて下さい。 一応動きましたけど、動作確認は十二分に。

seven9317
質問者

お礼

ご回答ありがとうございます! さっそく試してみましたが、上手く動作しませんでした・・・ どこか解釈を間違えてしまっているのでしょうか; str = objct.innerHTML; if (serchindex < 0) serchindex = str.length;//←この一文を付けたし start = str.lastIndexOf(serchstr, serchindex);//←lastを付けたし if (start > 0) { 全ての「serchindex = 0」の0を-1に変える。 最後付近「serchindex=start+txt.length;」を→「serchindex = start;」に変える。 で合ってますでしょうか? お手数ですが確認して頂けますと幸いです; 自分の方でも、ご回答を参考に引き続き頑張ってみます。 それと質問内容の補足ですが、 イメージしているのは、質問内容に貼ったサイト様のフレーム版+ http://usagi-js.com/sample/jssample9_2.htm こちらのサイト様のように上からと下からの2方向で切り替えて検索が出来る機能です。 説明不足で申し訳ありません;

関連するQ&A

  • 同じページにJavaScriptは2つできないの??

    つたないHPを作っています。今は「何行かのテキストボックスの文字をスクロール」というJavaScriptを1つ使っています。 さらにもう1つJavaScriptを使用したいのですが、うまく作動してくれません。同じページに2つ使うことはできないのでしょうか? 新しく使用したいのは、http://jun89.xdap.jp/でみつけたオリジナルJS素材の「ひながた用吹出し」の「画像の泡」というものです。ここのソースをコピーしてそのまま貼り付け、画像だけ変えました。この「ひながた用吹出し」はきちんと作動するのですが、「何行かのテキストボックスの文字をスクロール」が作動しません。 headの中に2つのJavaScriptを入れて、<body onLoad="star()""roll()">として、その後bodyの中に必要なものを入れています。この設定が間違っているのでしょうか?2つ同時に設定せずに、1つずつではきちんと作動しています。 PC初心者で、きちんとしたPC用語で説明できていないので、わかりづらいかと思いますが、よろしくお願いいたします。

  • JavaScriptだと思うのですが・・・

    下のサイトにあるようにクリックすると答が出て、もう一度クリックすると元に戻るようにするにはどのようにすればいいのでしょうか? JavaScriptのサンプルが置いてあるページを探してみたのですがうまく見つけられませんでした。 分かりやすい解説つきのページがあったら教えてください。 http://www.x-sell.co.jp/saiyo/faq.htm

  • javascriptが入っているリンクが開けません

    昨日からブラウザーの下にjavascriptと出るサイトが見れません。 移動しないし、別ウィンドウでも開かないです。 (別ウィンドウを右クリックで開いても真っ白なままです) たとえば、教えてgooトップページの「さぁ、質問しましょう!」というところの「教えて!」は javascript:document.nsform.submit();で開けません。 また「例:オススメの海外ドラマは?」というところは javascript:nsexample_search();で開けません。 どうしたら開けるようになりますか? コンピューターに関しては全くの無知なので、言葉が足りないかもしれませんが、大変困っております。 よろしくお願い致します。

  • javascriptとHTML

    javascriptが入ったHTMLをFC2やYahoo!ジオシティに投稿したいんですが、文字化けが起こり、かつjavascriptも正常に作動しません。 記述にミスがあるのか、投稿したところがjavaに対応していないのか、解決できる方はよろしくお願いします。 以下一つ問題リンク↓ http://1st.geocities.jp/zelgnir/rbfa-sort-problem.html

  • Firefox3.0.3でこのページの検索ができない

    http://www.saimonjo.jp/musetheque/welcome.do 上記サイトの検索をしたいのですが、「地図」を選択して、「次へ」をクリックしても 何も起こりません。 どこの設定を直せばいいでしょうか? java,javascriptはオンになっています。 またopera9.IE7では正常に動作します。 よろしくお願いします。

  • javascriptで診断ページを作成したいです。

    こんばんは。質問させていただきます。 http://noevirgroup.jp/nov/skincheck/check.aspx 自分のサイト内に上記サイトのようなチェックした数によって結果が複数に分岐するような診断ページを作成したいと思っています。 htmlとjavascriptだけで可能でしょうか? 上記サイトがどのようなスクリプトを使用されているかよくわかりません…。 スクリプトの部分をどう記述すればよろしいでしょうか? 見た目だけの静的なページは同様に作ることはできます。 診断項目15個程度と結果を3~5タイプほど設けたいです。 どなたかご教授いただけましたら幸甚です…。 よろしくお願いいたします。

    • ベストアンサー
    • HTML
  • javascriptによる文字検索

    文字検索に http://winofsql.jp/VA003334/JScriptSAMPLE011022204502.htm のサイトを参考に使用していますが、検索結果の文字の背景にカラー(例えば黄色の背景)で表示させたりすることはできるのでようか? いろいろとサイトを調べましたが、検索キーワードが悪いのか見つかりません。 知っている方いらっしゃいましたら教えて下さい。

  • Javascriptで記述したページが開けない

    Norton Internet Security 2003を使っています。 この設定がいまいち分かりにくいのですが、WEBページにJavascriptの記述があるリンクを開くことが出来ません。 Norton Internet Securityを一旦無効にした後でページの表示を更新すれば見られますが、有効にしたままだと表示できないのです。 見たいページは怪しいサイトでは明らかに無いのですが、いちいち無効にするのは面倒です。 何か良い方法はありませんか?

  • 検索結果ページの‘index.htm’表示を削除したい。

    yahoo!の検索結果ページで表示される、サイトのTOPページのURLが、先日まで‘ドメイン’までだったのに(例:~.jp)、急に‘~.jp/index.htm’と表示されるようになりました。元の‘ドメイン’までの表示にするにはどうすれば良いでしょうか? また原因はなんでしょうか? ※サイト内のリンクにひとつだけ、TOPページへのリンクを‘index.htm’で指定していました。これが原因かと思い、今は‘~.jp’の形で修正しました。 ※サイトを1週間ほど前にリニューアルしました。旧サイトではサイト内のTOPページへのリンクは全て‘~.jp’の形でした。

  • このJavaScriptを動かしたい!

    こんばんわ。 http://bodytag.org/bt_melter/ ↑ こちらのサイトのようなJavaScriptを動かしたいのですが、 どうやったら動くのでしょうか。 JSファイルをDLして、サーバにアップしました。 もちろんHTMLにも<script>~</script>を記述しました。 JSファイルをいじくったりしなければ作動しないのでしょうか??

専門家に質問してみよう