下拉窗体，当提交加载url

我想做一个基本下拉的论坛，当选择选项时，他们会加载一个网址提交按钮点击。下拉窗体，当提交加载url

，我想这样的事情

降自行车下来一个

品牌： KTM自行车宝马 Ect的

型号：（如果KTM上面采摘会显示） EXC Ect

（如果宝马以上选择将会sh OW） GS 冒险 Ect的

因此，如果自行车的化妆是KTM和提交按钮的点击模式是990将加载 Www.website.com/ktm/990

这是代码我有我已经挑选部分分类，所以如果你选择KTM，它会向你展示KTM的模型，并且与宝马一样，唯一的问题是我无法获得该网址的工作，并没有真正的想法如何做到这一点。

<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>

来源

2012-08-11 Nick Scotton

添加此功能，您的脚本

的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-11 13:23:46

非常感谢:) – 2012-08-11 15:26:58

您可以使用选定选项的简单拼接的URL，并在你的按钮单击处理程序设置location = "<new 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-11 13:01:34

下拉窗体，当提交加载url

回答

相关问题