JSFiddle - React, Tailwind, and code Playground
by follor
HTML
<table>
<tr id="xfield_holder_marka_avtomobilya">
<td class="addnews">Марка автомобиля:</td>
<td class="xfields" colspan="2">
<select name="xfield[marka_avtomobilya]" id="1111" required="" >
<option value="">Не выбрано</option>
<option value="1">Acura</option>
<option value="2">Alfa Romeo</option>
<option value="3">Aston Martin</option>
<option value="4">Audi</option>
<option value="5">BAW</option>
<option value="6">Bentley</option>
<option value="7">BMW</option>
<option value="8">Brilliance</option>
<option value="9">Buick</option>
<option value="10">Cadillac</option>
<option value="11">Changan</option>
<option value="12">Chery</option>
<option value="13">Chevrolet</option>
<option value="14">Chrysler</option>
<option value="15">Citroen</option>
<option value="16">Dacia</option>
<option value="17">Daewoo</option>
<option value="18">DAF</option>
<option value="19">Daihatsu</option>
<option value="20">Datsun</option>
<option value="21">DODGE</option>
<option value="22">FAW</option>
<option value="23">Ferrari</option>
<option value="24">Fiat</option>
<option value="25">Fisker</option>
<option value="26">Ford</option>
<option value="27">Foton</option>
<option value="28">Freightliner</option>
<option value="29">Geely</option>
<option value="30">GMC</option>
<option value="31">Great Wall</option>
<option value="32">Hafei</option>
<option value="33">Honda</option>
<option value="34">HOWO</option>
<option value="35">Hummer</option>
<option value="36">Hyundai</option>
<option value="37">Infiniti</option>
<option value="38">Iran Khodro</option>
<option value="39">Isuzu</option>
<option value="40">Iveco</option>
<option value="41">JAC</option>
<option value="42">Jaguar</option>
<option value="43">Jeep</option>
<option value="44">Jiangling</option>
<option value="45">KIA</option>
<option value="46">Lada</option>
<option value="47">Lamborghini</option>
<option value="48">Lancia</option>
<option value="49">Land Rover</option>
<option value="50">Lexus</option>
<option...
JavaScript
$(function() {
var $first = $('#1111'),$last = $('#11_1111'),
hide = {2 : $('option', $last).slice(2,8), 3 : $('option',$last).slice(8,12)},
$targetList = $('#1_1111');
var update = function() {
showFirst = [2, 3].indexOf(+this.value) >= 0;
$targetList.toggle(showFirst)
hide[2].add(hide[3]).remove();
showFirst && hide[this.value].appendTo($last);
$last.val(1).change();
};
var update2 = function() {
var val = +this.value;
var showFirst = [3, 4, 5, 6, 7, 8].indexOf(val) >= 0;
var showSecond = [9, 10, 11, 12].indexOf(val) >= 0;
$('#f_lr1rooq').toggle(showFirst);
$('#f_lr1ronq').toggle(showSecond);
};
$first.change(update).change();
$last.change(update2).change();
});