• ベストアンサー
※ ChatGPTを利用し、要約された質問です(原文:javaScriptを使用した入力文字の継承)

javaScriptを使用した入力文字の継承

このQ&Aのポイント
  • javaScriptを使用して既存のWebページに路線検索機能を追加する方法について教えてください。
  • yahoo!路線検索にリンクさせた際に、入力した出発駅・目的地の内容が反映されない問題が発生しています。
  • 初めてjavaScriptを使用するため、ソースコードに抜けがあるのか原因が分かりません。どなたかご教授いただけないでしょうか。

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

  • ベストアンサー
  • fujillin
  • ベストアンサー率61% (1594/2576)
回答No.3

アクションの設定が「http://transit.yahoo.co.jp/」だと検索入力のページなので、ここへリンクするのであれば、わざわざ事前に一部の項目だけ入力させてからジャンプすることの意味がわかりません。(単純なリンクで良いのでは?) もしも、検索結果を表示させたいのであれば、リンク先は「http://transit.yahoo.co.jp/search/result」になるはずですが、出発地と目的地だけの情報でここへジャンプすると、航空機や新幹線は使わないという設定になるので、遠距離地を入力してみるとけっこう笑える結果になって実用的ではありません。 また、ANo2様のおっしゃるようにブラウザのエンコードではうまくいかないようなので、自分でURLエンコードしておく必要がありそうですね。 これにjavascriptを使うとして、こんな感じでしょうか? <html><head> <script language="JavaScript"><!-- function test(f){ a = "from=" + encodeURI(f.from.value) + "&to=" + encodeURI(f.to.value); elmnts = f.childNodes; for (e=0; e<=elmnts.length-1; e++) { if (elmnts[e].type == "checkbox") { elmnts[e].value = (elmnts[e].checked) ? 1:0; a = a + "&" + elmnts[e].name + "=" + elmnts[e].value; } } window.location.href="http://transit.yahoo.co.jp/search/result?" + a; return false; } //--></script> </head> <body> <form method="get" action="http://transit.yahoo.co.jp/"> 出発地<input type="text" name="from"> 目的地<input type="text" name="to"> <input type="button" value="路線検索" onclick="test(this.form);"> <br> <input type="checkbox" name="shin" value="1" checked>新幹線を使う  <input type="checkbox" name="ex" value="1" checked >有料特急を使う <br> <input type="checkbox" name="hb" value="1" checked>高速バスを使う <input type="checkbox" name="al" value="1" checked>空路を使う </form> </body> </html> 適当に作ってみましたが、とりあえず動くみたいです。でも、他にもいろいろな付加情報がありますので、全容を把握した上で作成しないと、きちんと機能しない可能性があります。 というよりも、中途半端に利用するよりも単純にトップにリンクするだけしておいた方が、結果的には親切になると思いますけど・・・

chaser007
質問者

お礼

ご丁寧にありがとうございました。今回は、(諸事情で)路線のみの検索にすることになりまして…。javascriptについてはまだまだ知識に乏しいのですが、今後も引き続き勉強していきたいと思います。

その他の回答 (2)

  • pick52
  • ベストアンサー率35% (166/466)
回答No.2

ANo.1さんと同じですがJavaScript使っていませんよね? あと、HTMLでは属性と値そしてそれを繋ぐ=の間にスペース入れては いけません。 <form method="get" action="http://transit.yahoo.co.jp/"> 出発地<input type="text" name="from"> 目的地<input type="text" name="to"> <input type="submit" value="路線検索"> </form> それと、更にページのエンコードがUTF-8以外だと正常に渡せないと 思います。

chaser007
質問者

お礼

ANo.3さんのおかげで解決致しました。ありがとうございました。

chaser007
質問者

補足

ANo.1さんANo.2さんのご指摘通りJavaScriptを使っていませんね汗。 では、下記のような流れで書けばよいのでしょうか? 一応、路線サイトには飛びます。 <html> <head> <title>"路線検索機能"</title> <script language="JavaScript"> <!-- ※ここに入力文字を飛ばす処理内容を書く? //--> </script> </head> <body> <form method="get" action=" http://transit.yahoo.co.jp/"> 出発地<input type="text" name="from"> 目的地<input type="text" name="to"> <input type="submit" value="路線検索"> </form> </body> </html>

  • yambejp
  • ベストアンサー率51% (3827/7415)
回答No.1

javascriptを使っているようには見えませんが・・・ ちなみに <form>タグが<from>になっているのでこのままでは飛びません。 逆に、出発地のnameがfromになるはずがformとなっています。 これでは出発地ははいりません

chaser007
質問者

お礼

ANo.3さんのおかげで解決致しました。ありがとうございました。

chaser007
質問者

補足

すみません。<form>タグに関しては、私の記述ミスでした。出発地のnameはfromですね?修正して実行しても、入力文字はやはり飛んでませんでした。

関連するQ&A

専門家に質問してみよう