0

オプションを選択すると、送信ボタンのクリックで URL が読み込まれる基本的なドロップダウン フォーラムを作成しようとしています。

私はこのようなものが欲しいです

1つドロップダウン

バイクのメーカー: KTM BMW Ect

バイクのモデル: (上記で ktm を選択した場合) 990 EXC Ect

(上記で選択した BMW が表示される場合) GS Adventure Ect

したがって、バイクのメーカーが ktm で、送信ボタンをクリックするとモデルが 990 である場合、www.website.com/ktm/990 が読み込まれます。

これは私が持っているコードです。ピッキングパーツをソートしたので、KTM を選択すると、KTM のモデルが表示されます。BMW と同じように、唯一の問題は、URL がまったく機能せず、どうすればよいかわかりません。それ。

<script language="javascript" type="text/javascript">
<!--
 function setOptions(chosen) {
var selbox = document.myform.model;

selbox.options.length = 0;
if (chosen == " ") {
  selbox.options[selbox.options.length] = new Option('Please select one of the options above first',' ');

}
if (chosen == "BMW") {
  selbox.options[selbox.options.length] = new
Option('R1200-GS-Adventure','R1200-GS-Adventure');
  selbox.options[selbox.options.length] = new
Option('R1200-GS','R1200-GS');
  selbox.options[selbox.options.length] = new
Option('R1200-RT','R1200-RT');
  selbox.options[selbox.options.length] = new
Option('1150-GS-Adventure','1150-GS-Adventure');
  selbox.options[selbox.options.length] = new
Option('1150-GS','1150-GS');
}
if (chosen == "KTM") {
  selbox.options[selbox.options.length] = new
Option('990','990');
  selbox.options[selbox.options.length] = new
Option('640','640');
}
if (chosen == "Yamaha") {
  selbox.options[selbox.options.length] = new
Option('Tenére 660XT','Tenére 660XT');
  selbox.options[selbox.options.length] = new
Option('Super Tenére 1200XT','Super Tenére 1200XT');
}
}
// -->
</script>

とフォームコード

  <form name="myform"><div align="center">
<select name="bike" size="1"
onchange="setOptions(document.myform.bike.options[document.myform.bike.selectedIndex].value);">
<option value=" " selected="selected"> </option>
<option value="BMW">BMW</option>
<option value="KTM">KTM</option>
<option value="Yamaha">Yamaha</option>
</select><br> <br>
<select name="model" size="1">
<option value=" " selected="selected">Please select one of the options above first</option>
</select>
<input type="button" name="go" value="Search"
onclick="alert(document.myform.model.options[document.myform.model.selectedIndex].value);">
</div></form>
4

2 に答える 2

0

この関数をスクリプトに追加します

Javascript:

function loadURL(){


    var bike = document.myform.bike.options[document.myform.bike.selectedIndex].value;
    var model = document.myform.model.options[document.myform.model.selectedIndex].value;


    if(bike != ' ' && model != ' '){

        var url = 'http://YOURWEBSITE.com/' + bike + '/' + model;
        window.location = url;

    }//if




}

そして、これを送信ボタンにします

HTML

<input type="button" name="go" value="Search" onclick="loadURL();">
于 2012-08-11T13:23:46.160 に答える
0

location = "<new URL>"選択したオプションの単純な連結を使用して URL を作成し、ボタン クリック ハンドラーで設定することにより、選択したページにリダイレクトできます。

onclick="location='http://www.website.com/' + myform.bike.options[myform.bike.selectedIndex].value + '/' + myform.model.options[myform.model.selectedIndex].value;"

実用的なソリューションが必要な場合はお知らせください。

また、ボタンのクリックを許可する前に、ユーザーがバイクのドロップダウンで何かを選択したことを確認する必要があります。そうしないと、URL は無効になります。

編集: これは完全なソリューションを示す JSFiddle です: http://jsfiddle.net/V8jPn/1/

于 2012-08-11T13:01:34.493 に答える