Выберите опцию с jquery на основе другого поля выбора опций

Question

У меня есть 2 окна выбора. Я хочу манипулировать другим полем на основе опции, выбранной в первом поле.

<select name="abc" id="abc"> 
    <option value="1">A</option> 
    <option value="2">B</option> 
    <option value="3">C</option> 
</select> 

И второй выберите поле

<select name="xyz" id="xyz"> 
    <option value="1">X</option> 
    <option value="2">Y</option> 
    <option value="3">Z</option> 
</select> 
<br> 

Теперь то, что я хочу есть, при загрузке страницы, если выбрать вариант 1, т.е. А, второй флажок должен быть автоматически установлен в опции 3, т. Е. Z и наоборот. Если я выбираю вариант 2 i.e B в первом selectbox, второй select box должен отображать опцию 1 i.e X и наоборот и так далее. Какую функцию jquery использовать?

Answer 1

Вы можете просто делать что-то вроде этого, используя change() обработчик события

var $select = $('#abc,#xyz'); 
 
$select.change(function() { 
 
    $select.val(this.value); 
 
}).change();

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
 
<select name="abc" id="abc"> 
 
    <option value="1">A</option> 
 
    <option value="2">B</option> 
 
    <option value="3">C</option> 
 
</select> 
 
<select name="xyz" id="xyz"> 
 
    <option value="2">X</option> 
 
    <option value="3">Y</option> 
 
    <option value="1">Z</option> 
 
</select>