Выбрать детей зависит от родителя Выберите

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

Здесь я нашел полный учебник и примеры кода. LINK

Answer 2

Не уверен, что ваш вопрос, но вы можете сделать функцию изменения:

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

Answer 3

Вы должны дать иждивенцы выбрать другой идентификатор, я выбрал cities для этого примера, и вам необходимо создать карта городов, которые соответствуют значениям country. Добавьте прослушиватель событий onchange в родительский элемент, который обновляет параметры зависимого выбора в соответствующих городах. Вот простой пример:

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); 
 
    })) 
 
})

<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>

Answer 4

Вы можете найти этот фрагмент

$(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>