JSP下拉列表问题

Question

我想问一个问题

我想在一个JSP页面中显示3个下拉列表,

其中第二个下拉列表基于第一个下拉列表中的选定值,

等等...

根据我的有限知识,当用户从下拉列表中选择一个值时,

用户需要单击按钮将值传递给服务器端.

像这样:

<form action="second_drop.jsp">
   <select name="drop">
    ...
   </select>
   <input type="submit" value="Submit" />
</form>

现在,我想问一个问题,

是否可以在不单击按钮的情况下传递下拉列表值？

也就是说,当用户从下拉列表中选择一个值时,

所选值可以自动传递到服务器端而无需单击"提交"按钮.

然后服务器将根据所选值显示第二个下拉列表

感谢帮助.

Answer 1

使用ajax的神秘力量绝对可以做到这一点!您正在寻找的这种特殊行为称为"链式下拉列表"或"依赖下拉列表".这是我用jQuery做的方式,有很多评论,所以它(希望)清楚:

标记

<form action="second_drop.jsp">
   <select id="first_drop" name="drop">
    ...
   </select>
   <select id="second_drop" disabled="disabled"></select>
   <input type="submit" value="Submit" />
</form>

JavaScript的

$(function () // run the following code when the DOM is ready
{
    $('#first_drop') // equivalent to document.getElementById('first_drop')
        .change(function () // run the following code whenever the DDL value changes
        {
            var val = $(this).val(); // get the new value of the first DDL
            $('#second_drop').load(
              'second_drop.jsp', // this is the URL to load
              {drop: val} // pass this data to the server with the request
              function () // execute this function when the response comes back
              {
                  $('#this').attr('disabled', false); // enable the 2nd DDL
              });
        });
});

second_drop.jsp应该回复一个<option>s 列表:

<option value="val1">Option 1</option>
<option value="val2">Option 2</option>
<option value="val3">Option 3</option>

那里有很多,如果你不熟悉JavaScript和/或jQuery,那么只要问你是否有任何你不理解的东西.

使用jQuery函数

• $(),简写 $(document).ready()
• $(),选择器功能
• .change()
• .val()
• .load()
• .attr()