Question

如何根据父选择使用js或jquery来改变子选择。

<select id="country">
<option value="1">United states</option>
<option value="2">United kingdom</option>
<option value="3">France</option>
</select>

<select id="country">
<option value="">Select country first</option>
</select>

如果用户选择英国（值= 2）只应加载英国地区，否则应说“先选择国家”。

Answer 1

您需要为您的相关人选择不同的ID，我为此示例选择了cities，您需要创建与country值对应的城市地图。向父级添加onchange事件侦听器，以更新相关城市的从属选择选项。这是一个简单的例子：

＆＃13;

var cityMap = {
    "1": ['New York', 'San Francisco'],
    "2": ['London', 'Cambridge'],
    "3": ['Paris', 'Nice']
}

$('#country').on('change', function() {
    var cities = cityMap[$(this).val()];
    $('#cities').empty().append(cities.map(function(city) {
        return $('<option />').text(city);
    }))
})

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select id="country">
  <option>Select a country</option>
  <option value="1">United states</option>
  <option value="2">United kingdom</option>
  <option value="3">France</option>
</select>

<select id="cities">
  <option value="">Select country first</option>
</select>

＆＃13;

Answer 2

不确定您的问题，但您可以对更改进行操作：

$("#country").change(function(){
if($(this).val() == 2){
//United Kingdom selected
}else{
...
}
});

Answer 3

请找到此代码段

 $(function(){
    $("#country").on("change",function(){
    
    
    
    if($(this).val() == "0")
    {
    
    alert("Please select Country");
    }
    else
    {
    
    alert($(this).val());
    //do you rest of work for Country binding
    }
    });
    
    })

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select id="country">
<option value="0">Select</option>
<option value="1">United states</option>
<option value="2">United kingdom</option>
<option value="3">France</option>
</select>

<select id="country">
<option value="">Select country first</option>
</select>

Answer 4

在这里，我找到了完整的教程和示例代码。 LINK

选择孩子取决于父选择

4 个答案: