Question

我正在尝试使用第二个选择创建一个下拉列表，具体取决于第一个选择，所有信息都来自一个大数据库。

这些是我需要使用的两个表和列，包含2个示例。

表国家/地区：CODE，NAME

           RO     ROMANIA

           GB     GREAT BRITAIN

表区域：代码，名称，ISOCOUNTRYCODE

        RO213   Vrancea     RO

        RO345   Vaslui      RO

        GB365   London      GB

        GB453   Manchester  GB

这就是我在JSP中所拥有的：

<td>Ţara în care s-a efectuat prelevarea probei *:</td>
<td>
   <select name="sampcountry" onblur="return validate2(this);" title="Ţara în care a fost prelevata proba (ISO 3166-1-alpha-2).">
      <option value="" />
      <%ResultSet rs1=s t.executeQuery( "select code,name from country"); while(rs1.next()){ %>
         <option value="<%=rs1.getString(" code ")%>">
            <%=rs1.getString( "name")%>
         </option>
         <%}%>
   </select>
</td>
</tr>

<tr>
   <td>Zona de prelevare:</td>
   <td>
      <select name="samparea" style="width: 300px" title="Zona în care a fost prelevată proba  (Nomenclatorul Unităţilor Teritoriale pentru Statistică NUTS –  sistem de coduri valabil doar pentru ţările membre UE şi Elveţia).">
         <option value="" />
         <% ResultSet rs2=s t.executeQuery( "select code,name,isocountrycode from area"); while(rs2.next()){ %>
            <option value="<%=rs2.getString(" code ")%>">
               <%=rs2.getString( "name")%>
            </option>
            <%}%>
      </select>
   </td>
</tr>

我需要的是，当我在第一个选择框中选择国家/地区时，第二个选择框将仅显示该国家/地区的区域。 AREA.ISOCOUNTRYCODE列包含COUNTRY.CODE列信息，如上述示例所示。

Answer 1

这样的事情可以完成这项工作

$("select[name=sampcountry]").on("change", function(){
  $("select[name=samparea] option")
    .hide().removeAttr("selected")
    .parent().find("option[value^="+ $(this).val() +"]").show()
    .first().prop("selected",true);
});

这将首先隐藏所有选项，然后显示哪些值以所选国家/地区代码开头。

<强> FIDDLE

来自数据库jsp的依赖动态下拉列表

1 个答案: