Question

我有一些代码可以创建像Country＆amp ;;这样的2个下拉列表。我和城市可以选择国家，然后选择城市。如何使用类似this image的jquery进行搜索下拉列表：

选择国家和城市后的用户和提交按钮转到此地址：

www.example.com/[country_value]/[city_value]

这是代码：

<!DOCTYPE html>
<html>
  <head>
    <title></title>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <script type="text/javascript">
      var citiesByState = {
        USA: ["NY","NJ"],
        Singapore: ["taas","naas"]
      }
      function makeSubmenu(value) {
        if(value.length==0) 
          document.getElementById("citySelect").innerHTML = "<option></option>";
        else {
          var citiesOptions = "";
          for(cityId in citiesByState[value]) {
            citiesOptions+="<option>"+citiesByState[value][cityId]+"</option>";
          }
          document.getElementById("citySelect").innerHTML = citiesOptions;
        }
      }
      function displaySelected() {
        var country = document.getElementById("countrySelect").value;
        var city = document.getElementById("citySelect").value;
        alert(country+"\n"+city);
      }
      function resetSelection() {
        document.getElementById("countrySelect").selectedIndex = 0;
        document.getElementById("citySelect").selectedIndex = 0;
      }
    </script>
  </head>
  <body onload="resetSelection()">
    <select id="countrySelect" size="1" onchange="makeSubmenu(this.value)">
      <option></option>
      <option>USA</option>
      <option>Singapore</option>
    </select>
    <select id="citySelect" size="1">
      <option></option>
    </select>
    <button onclick="displaySelected()">show selected</button>
  </body>
</html>

使用jquery通过搜索创建下拉列表并将其放入url中

0 个答案: