• ベストアンサー

HP上のデータ部分に検索機能を設ける為には?

私は、下のサイトに倣って架空の力士の四股名を載せるHPを作成したいと思っています。 http://www.szumo.hu/Sumotori/ 例えば、「出身地」のボタンがありますが、ここをクリックすると http://www.szumo.hu/Sumotori/index-birthplace.html 上のように県名や国名がズラリと並んだページが出て来ます。 ここで、例えば「モンゴル」のボタンをクリックすると、下のようにモンゴル出身の力士の名前がズラリと表示されます。 http://www.szumo.hu/Sumotori/Rikishi-Mongolia.html 私が作りたいHPにもこういう機能を設けたいのですが、具体的にどのようにすれば良いのでしょうか? また、私はデータの部分はデータ整理の利便性(?)や装飾を理由にエクセルで作成予定です。 どなたか御回答を宜しく御願い致します。

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

  • ベストアンサー
回答No.2

以下を外部スクリプト(.js)として保存してください。 function jump(){ if (document.serectForm.select1.options[document.selectForm.select1.selectedIndex].value != "none") { document.location = document.selectForm.select1.options[document.selectForm.select1.selectedIndex].value } } document.write('<form name=\"selectForm\"><select name=\"select1\">'); document.write('<option value=\"none\">Nolink</options>\n'); document.write('<option value=\"URL_1\">Link1</options>\n'); document.write('<option value=\"URL_2\">Link2</options>\n'); document.write('<option value=\"URL_3\">Link3</options>\n'); document.write('</select>'); document.write('<input type="button" VALUE="Go" onclick="jump();">'); document.write('</form>'); ここまで <body>タグ内のメニューを表示させたいところに <script src="外部スクリプト名.js"></script>を記述。 後は各リンクを完璧に作るだけ。 参照しているURLのセレクトメニューは別に検索使っているわけではありません。 リンクをセレクトメニューで行なっているだけです。

13oclock
質問者

補足

回答有り難う御座いました。 何となく参考になりそうな気がしていますが、私はHP作成に関しては初心者なので、もし宜しければもう少し詳しく教えて頂くことは出来ないでしょうか?

その他の回答 (2)

回答No.3

htmlファイルの構成も分からないといっているのですか? セレクトメニューによるリンクはjavascriptの知識も必要です。 少なくともhtmlの超基本のタグの意味ぐらいは理解していないと話になりません。 「初心者だから」で何でも聞けると思わないでください。 Web上の(この手のリンクに関する)文献は山ほどあります。 少しぐらいは自分で勉強してください。 > 外部スクリプト(.js)として保存してください。 メモ帳等テキストエディタで作ったファイルを拡張子[.js]で保存してください。 ファイル名は半角アルファベットです。 先にあげた外部スクリプトの中で書き換えるのは以下のみ。 document.write('<option value=\"URL_1\">Link1</options>\n'); document.write('<option value=\"URL_2\">Link2</options>\n'); document.write('<option value=\"URL_3\">Link3</options>\n'); URL_*には実際にリンクするURLを Link*には実際に表示するテキストを入れます。 増やしたかったらいくらでも増やしてください。 document.write('<input type="button" VALUE="Go" onclick="jump();">'); Goはボタンの文字です。好きなように書き換えてください。 先に言わなければいけなかったのですが この手のデータベースっぽく作るサイトは非常に手間がかかります。 質問者さんが希望している「検索型」のサイトは これぐらいの構成が理解できないようではまったく手も出ません。 html初心者ならこんな複雑で多種の知識が必要なサイトより 普通に<a>タグでリンク張ったり<li>でリスト作ったりしたほうが 簡単で見栄えもいいと思いますよ。

13oclock
質問者

補足

回答有り難う御座いました。 htmlの知識については、本屋で何か専門書でも買って読んでみようと思ったりもしましたが、憶える量が多過ぎて勉強を始めるにも手が出せないというのが正直なところでした。1つ1つ憶えようとしても、憶えたい内容が片っ端から頭から抜け落ちていってしまうのです。我ながら全く話にならないと思いました。 ところでリストの件ですが、データの量が余りに膨大過ぎる為検索型のサイトにせざるを得ないと思ったのです。 兎に角、この方法では非常に手間が掛かる、初心者には簡単に手が出ないことが分かりましたので御礼をさせて頂きたいと思います。 ありがとうございました。

  • dandy123
  • ベストアンサー率14% (2/14)
回答No.1

少々お聞きしたいのですが?貴方は現在ホームページをお持ちですが?貴方の質問はリンク機能のことと思います。貴方がHPをお持ちの場合は新しいページを作成してそこに好きな内容の話題を作成してください。そこにリンクを貼ってジャンプしたいページを開いて下さい。アップロードが必要ですよ。自分もHPを持ってます。今は引越しのため停止していますがね・・・がんばってみてください。 HP作成ソフトはお持ちですか? ホームページビルダーなど良いかもね 以上

13oclock
質問者

補足

回答有り難う御座いました。 HPはこれから作るところです。 リンク機能といっても、ただのリンクではなく全データの内の検索条件に該当する部分が表示されるようなリンクの仕方をしたいのです。

関連するQ&A

専門家に質問してみよう