Question

我想拥有2个菜单列表，您必须从每个列表中选择一个选项，然后单击下一个按钮将您带到另一个页面。

这是一个链接：http://home.comcast.net/~techjunkee/

Answer 1

请注意，我更改了SELECT元素的ID。我这样做是为了更容易在JavaScript中找到特定元素。为了实现这一目标，每个元素都应该有自己独特的ID。

<select id="jumpMenu1">
 <option value="0">Choose</option>
 <option value="">13</option> 
 <option value="">14</option> 
 <option value="">15</option> 
 <option value="">16</option> 
 <option value="">16.5</option> 
 <option value="">17</option> 
 <option value="">17.5</option> 
 <option value="">18</option> 
 <option value="">19.5</option> 
 <option value="">20</option> 
 <option value="">21</option> 
 <option value="">22</option> 
 <option value="225.html">22.5</option> 
 <option value="">24</option> 
 <option value="245.html">24.5</option> 
</select>

<select id="jumpMenu2">
 <option value="0">Choose</option>
 <option value="">11</option> 
 <option value="">12</option> 
 <option value="">13</option> 
 <option value="">16</option> 
 <option value="">16.5</option> 
 <option value="">17</option> 
 <option value="">17.5</option> 
 <option value="">18</option> 
 <option value="">19.5</option> 
 <option value="">20</option> 
 <option value="">21</option> 
 <option value="">22</option> 
 <option value="225.html">22.5</option> 
 <option value="">24</option> 
 <option value="245.html">24.5</option> 
</select>

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

...以及JavaScript：

function goToPage()
{
  var jumpMenu1Value = document.getElementById("jumpMenu1").value;
  var jumpMenu2Value = document.getElementById("jumpMenu2").value;

  if(jumpMenu1Value !== 0 && jumpMenu2Value !== 0)
  {
    window.location = "someplace.html?jumpMenu1=" + 
                      jumpMenu1Value + "&jumpMenu2=" + 
                      jumpMenu2Value;
  }
}

Answer 2

您提供的脚本有效，但我想我无法弄清楚如何定位不同的网页而不是“someplace.html”

值让我对如何翻译此网址（http://home.comcast.net/~techjunkee/index.html?jumpMenu1=1&jumpMenu2=5）

感到困惑

抱歉是一只鸟脑。我正在努力学习这个。

Answer 3

您有两种选择：

1）您每次都会重定向到同一页面，但是当页面加载时，您应检查查询字符串中的值，并根据该值显示所需的内容。这是从查询字符串中获取值的方法：

protected void Page_Load（object sender，EventArgs e）

{

 double jumpMenu1; 

 double jumpMenu2;

 try{jumpMenu1 = double.Parse(Request.QueryString["jumpMenu1"]);}catch {jumpMenu1 = 0;}

 try{jumpMenu2 = double.Parse(Request.QueryString["jumpMenu2"]);}catch {jumpMenu2 = 0;}

}

2）您还可以根据这两个选择值中的值重定向到javascript中的不同页面。

函数goToPage（）

{

var jumpMenu1Value = document.getElementById（“jumpMenu1”）。value;

var jumpMenu2Value = document.getElementById（“jumpMenu2”）。value;

if（jumpMenu1Value！== 0＆amp;＆amp; jumpMenu2Value！== 0）

{

 switch (jumpMenu1Value)

 {

     case 13:

     {

        switch (jumpMenu1Value)

        {

           case 11:

           {

              // the page coresponding to the Rim Size "13" and Tire Size "11"

              window.location = "someplace13-11.html"; 

              break;

           }

           case 12:

           {

              // the page coresponding to the Rim Size "13" and Tire Size "12"

              window.location = "someplace13-12.html"; 

              break;

           }

           //...

           default:

           {

              // redirect to a default/error page or show an error message

           }

        }

     }

     case 14:

     {

        switch (jumpMenu1Value)

        {

           case 11:

           {

              // the page coresponding to the Rim Size "14" and Tire Size "11"

              window.location = "someplace14-11.html"; 

              break;

           }

           case 12:

           {

              // the page coresponding to the Rim Size "14" and Tire Size "12"

              window.location = "someplace14-12.html"; 

              break;

           }

           //...

           default:

           {

              // redirect to a default/error page or show an error message

           }

        }

     }


     //...   

     default:

     {

        // redirect to a default/error page or show an error message

     }

  }

}

else

{

   //show an error message, the user has to choose both options!

}

}

在2个下拉菜单列表中选择选项？

3 个答案: