سلام

برای ایجاد لیست های کشویی استان و شهرهای هر استان من اومدم از برای شهرهای هر استان یک لیست کشویی ساختم که تعدادشون برابر با تعداد استان های موجود در لیست کشویی اول می باشد که با انتخاب هر استان از لیست کشویی اول لیست کشویی شهرهای مرتبط با اون استان نمایش داده می شه و لیست کشویی ثبلی نمایان شده مخفی می شه....


Annotation 2024-05-08 101818.jpg

این لیست کشویی استانهاست:

Annotation 2024-05-08 102239.jpg


<label style="display: block">
استان:</label>
<select id="state" class="fieldText" style="width: auto; position: relative;" onchange="return state_onchange()">
<!-- <optgroup label="استان ها">-->
<option value="آذربایجان شرقی">آذربایجان شرقی</option>
<option value="آذربایجان غربی">آذربایجان غربی</option>
<option value="اردبیل">اردبیل</option>
<option value="اصفهان">اصفهان</option>
<option value="البرز">البرز</option>
<option value="ایلام">ایلام</option>
<option value="بوشهر">بوشهر</option>
<option value="تهران">تهران</option>
<option value="چهارمحال و بختیاری">چهارمحال و بختیاری</option>
<option value="خراسان جنوبی">خراسان جنوبی</option>
<option value="خراسان رضوی">خراسان رضوی</option>
<option value="خراسان شمالی">خراسان شمالی</option>
<option value="خوزستان">خوزستان</option>
<option value="زنجان">زنجان</option>
<option value="سمنان">سمنان</option>
<option value="سیستان و بلوچستان">سیستان و بلوچستان</option>
<option value="فارس">فارس</option>
<option value="قزوین">قزوین</option>
<option value="قم">قم</option>
<option value="کردستان">کردستان</option>
<option value="کرمان">کرمان</option>
<option value="کرمانشاه">کرمانشاه</option>
<option value="کهگیلویه و بویراحمد">کهگیلویه و بویراحمد</option>
<option value="گلستان">گلستان</option>
<option value="گیلان">گیلان</option>
<option value="لرستان">لرستان</option>
<option value="مازندران">مازندران</option>
<option value="مرکزی">مرکزی</option>
<option value="هرمزگان">هرمزگان</option>
<option value="همدان">همدان</option>
<option value="یزد">یزد</option>
<!--</optgroup>-->
</select>


این هم رویدادش در اسکرپت:

<script language="javascript" type="text/javascript">
// <=!=[=C=D=A=T=A=[
var SelectedState;
function state_onchange() {
var index = state.selectedIndex;
if (SelectedState != null) {
SelectedState.setAttribute("hidden", "hidden");
}
switch (index) {
case 0: SelectedState = select1;
break;
case 1: SelectedState = select2;
break;
case 2: SelectedState = select3;
break;
case 3: SelectedState = select4;
break;
case 4: SelectedState = select5;
break;
case 5: SelectedState = select6;
break;
case 6: SelectedState = select7;
break;
case 7: SelectedState = select8;
break;
case 8: SelectedState = select9;
break;
case 9: SelectedState = select10;
break;
case 10: SelectedState = select11;
break;
case 11: SelectedState = select12;
break;
case 12: SelectedState = select13;
break;
case 13: SelectedState = select14;
break;
case 14: SelectedState = select15;
break;
case 15: SelectedState = select16;
break;
case 16: SelectedState = select17;
break;
case 17: SelectedState = select18;
break;
case 18: SelectedState = select19;
break;
case 19: SelectedState = select20;
break;
case 20: SelectedState = select21;
break;
case 21: SelectedState = select22;
break;
case 22: SelectedState = select23;
break;
case 23: SelectedState = select24;
break;
case 24: SelectedState = select25;
break;
case 25: SelectedState = select26;
break;
case 26: SelectedState = select27;
break;
case 27: SelectedState = select28;
break;
case 28: SelectedState = select29;
break;
case 29: SelectedState = select30;
break;
case 30: SelectedState = select31;
break;
default:
}
SelectedState.removeAttribute("hidden");
}


function window_onload() {
SelectedState = select1;
}


// ]=]=>
</script>