1

我正在尝试创建两个下拉列表：下拉列表 A 列出了一个国家。下拉列表 B 列出了一个城市。列表 B 最初是空的，而列表 A 由一个国家/地区填充。用户可以选择一个国家，使列表 B 自动列出列表 A 中的城市。这些自然会来自数据库，所以这不是我问题的目标。我的问题是如何将列表 B 绑定为依赖于列表 A。我花了好几个小时研究答案并尝试各种 jquery 和 javascript 方法。我一直试图通过使用 List A 的 change 方法让 List B 响应 List A，但到目前为止，似乎没有任何效果，我也无法触发 List B 的响应以添加测试价值观。

我该怎么做呢？

4

4 回答 4

2

这是工作小提琴：Relative Drop-down 

$(function() {
var cities = {
    'INDIA': ['Delhi', 'Mumbai', 'Bangalore', 'Ahmedabad'],
    'USA': ['London', 'Los Angeles', 'Austin', 'New York']
};
var hashFunc = function(country, city){
    return country + "." + city;
};
//The form
var form = new Backbone.Form({
    schema: {
        country: { type: 'Select', options: ['INDIA', 'USA'] },
        city: { type: 'Select', options: cities.INDIA},
    }
}).render();
form.on('country:change', function(form, countryEditor) {
    var country = countryEditor.getValue(),
        newOptions = cities[country];
    form.fields.city.editor.setOptions(newOptions); 
});  
//Add it to the page
$('body').append(form.el);
});
于 2013-05-10T05:19:04.543 回答
0

选择任何选项时，根据其值，您可以为另一个选择创建动态选项。

$('#A').change(function() {
  if($('#A:selected').val() == "India"){

     $("<option></option>", 
        {value: "Surat", text: "Surat"})
       .appendTo('#B');
  } 
});
于 2013-05-10T05:07:34.510 回答
0 
$('#select1').change(function(){
callAjax(this.value);
});

function callAjax(value1)
{

//here write the code for ajax

}
于 2013-05-10T05:15:05.387 回答
0

没有数据库方案很难回答，但这里有。

假设您的数据库看起来像

    Countrys
 +--------------+
 | New Zealand  | 
 +--------------+
 | Australia    |
 +--------------+
 | India        |
 +--------------+

 Towns

    Country       Town
 +--------------+---------------+
 | NZL          | Auckland      |
 +--------------+---------------+
 | NZL          | Wellington    |
 +--------------+---------------+
 | NZL          | Christchurch  |
 +--------------+---------------+
 | AU           | Sydney        |
 +--------------+---------------+
 | AU           | Wagawaga      |
 +--------------+---------------+
 | AU           | Brisbane      |
 +--------------+---------------+
 | IN           | Mumbai        |
 +--------------+---------------+

……等等等等

首先选择

  <select onchange ="town()" id="country">
  <option value = "NZ">New Zealand</option> 
  <option value = "AU">Australia</option>
  <option value = "IN">India</option>
  </select>

第二个

  <select id="towns"></select>

Javascript

  function town()
  {
  var town = $('#country').val()
  $.ajax({
        type: "POST",
        url: "http://yourserver/rpc.php",
        data: { method: 'get_towns'},
        dataType: "json",
        timeout: 10000, // in milliseconds
        success: function(data) {
            $("#towns".html(data.towns)
            },
        error: function(request, status, err) {
            if(status == "timeout") {
                $.ui.hideMask();
               alert('This is taking too long. You could try again now, or wait and try again later.');
    }
    }
    });

}

从您的数据库返回 json 中的城镇

于 2013-05-10T06:41:21.360 回答