如何做页面重定向基于两个下拉菜单选择？

我想从我的网站上创建一个表单，用户有两个下拉框与值说body height和type of build。根据他们的选择，他们将被引导到一个页面，其中包含关于他们特定/选定构建的信息。如何做页面重定向基于两个下拉菜单选择？

有一个什么样我想创建一个想法，这是我希望显示的形式。如果使用的BMX自行车指南

功能GotoPage记述（）{VAR类型= 文件。.getElementById（ “类型”）值; var height = document.getElementById（“height”）.value; if（type！== 0 && height！== 0）{0} window.location =“http://www.maltabmx.com/About.html?jtype=”+ 1 +“＆height =”+ 1;

 window.location = "http://www.maltabmx.com/Footage.html?jtype=" + 
     1 + "&height=" + 
     2; 

     window.location = "http://www.maltabmx.com?jtype=" + 
     1 + "&height=" + 
     3; 

     window.location = "http://www.maltabmx.com/About.html?jtype=" + 
     1 + "&height=" + 
     4; 

     window.location = "http://www.maltabmx.com/Footage.html?jtype=" + 
     1 + "&height=" + 
     5; 

     window.location = "http://www.maltabmx.com?jtype=" + 
     1 + "&height=" + 
     6; } }

<form> <p> Type of Terrain: </p>

选择街/公园污垢赛车

<p>Body Height</p> 
<select id="height"> 
<option value="0" id="Select">Select</option> 
<option value="1" id="5ft">4ft</option> 
<option value="2" id="5.5ft">4.25ft</option> 
<option value="3" id="5.5ft">4.50ft</option> 
<option value="4" id="6ft">4.75ft</option> 
<option value="5" id="5ft">5ft</option> 
<option value="6" id="5.5ft">5.25ft</option> 
<option value="7" id="6ft">5.50ft</option> <option value="8" id="5ft">5.75ft</option> 
<option value="9" id="5.5ft">6ft</option> 
<option value="10" id="6ft">6.25ft</option> 
</select> 

<br /><br /> 

<input onclick="goToPage();" type="button" value="Submit" /> 

</form>

来源

2012-07-10 user1515230

后您检查$ _GET或$ _POST值显示正确的信息，或脚本重定向到确实的页面。你试过什么了？ – Waygood 2012-07-10 15:20:28

我已经编辑我的职务与形式我已经做了到现在，所以你可以有什么，我希望创建感谢的想法！ – user1515230 2012-07-10 16:11:44

<html> 
<head> 

    $(document).ready(function() { 

     $('#submit').click(function(){ 

     var type= $("#type").val(); 
     var height = $("#height").val(); 

     window.location.href = 'http://www.someweb.com/page.php?type='+type+'&&height='+height; 

    }); 

}); 

    </head> 
    <body> 

<form> 
<p> Type of Terrain: </p> 

    <select id="type"> 
    <option value="1" id="Street">Street</option> 
    <option value="2" id="Dirt">Dirt</option> 
    <option value="3" id="Park">Park</option> 
    <option value="4" id="Racing">Racing</option> 
    </select> 

    <p>Body Height</p> 
    <select id="Height"> 
    <option value="1" id="5ft">5ft</option> 
    <option value="2" id="5.5ft">5.5ft</option> 
    <option value="3" id="6ft">6ft</option> 

    </select> 

    <br /><br /> 

    <input id="submit" type="submit" value="Submit" /> 

    </form> 
    </body> 
</html>

所以，我改变了上面的代码。如果你还有一些问题，请告诉我。

PS：通常重定向或值传递到其他页面，你会想使用jQuery的$。员额，$不用彷徨或$阿贾克斯方法，而不是windows.location.href。

已编辑在这里http://net.tutsplus.com/tutorials/javascript-ajax/5-ways-to-make-ajax-calls-with-jquery/

一看 - 工作的解决方案：http://jsfiddle.net/YXW7K/13/

来源

2012-07-10 15:29:24 owsata

请你帮我指明如何将我的代码链接到上述表单.. SRY基因，但在编码即时通讯非常糟糕的还在出发 – user1515230 2012-07-10 16:32:57

请是不错的辅助技术的用户提供一个提交按钮，而不是自动提交表单时选择被改变。见[WCAG失败36]（http://www.w3.org/TR/2012/NOTE-WCAG20-TECHS-20120103/F36） – steveax 2012-07-10 16:40:17

所以，我改变了上面的代码。让我知道如果你仍然有一些问题 – owsata 2012-07-11 07:51:38

如何做页面重定向基于两个下拉菜单选择？

回答

相关问题