如何根据另一个下拉列表的选择来填充多个下拉列表

how to populate multiple dropdown depending on the select of another dropdown

本文关键字：下拉列表 填充 选择 何根 另一个      更新时间：2024-06-20

如何根据另一个下拉的选择填充多个下拉列表

我有这个下拉名称部分

<select name="section">
<option value="0">choose</option>
<option value="1">section1</option>
<option value="2">section2</option>
<option value="3">section3</option>
<option value="4">section4</option>
<option value="5">section5</option>
<option value="6">section6</option>
<option value="7">section7</option>
<option value="8">section8</option>
<option value="9">section9</option>
<option value="10">section10</option>
</select>

我有另外7个下拉列表，其中包含名称：subject1，subject2，subject3，subject4，subject5，subject6，subject7

我想根据下拉菜单"部分"的选择，用不同的值填充7个下拉菜单

例如，当我从下拉菜单"section"中选择section 1时，它会填充

dropdown subject1 with "1"
dropdown subject2 with "2"
dropdown subject3 with "3"
dropdown subject4 with "4"
dropdown subject5 with "5"
dropdown subject6 with "6"
dropdown subject7 with "7"

当我从下拉菜单"section"中选择section 2时，它会填充

dropdown subject1 with "a1"
dropdown subject2 with "a2"
dropdown subject3 with "a3"
dropdown subject4 with "a4"
dropdown subject5 with "a5"
dropdown subject6 with "a6"
dropdown subject7 with "a7"

依此类推

HTML:

<select name="section" onchange="yourfunction();">
....
</select>

Javascript：

yourfunction()
{
    // Your logic here...
}

这将解决您的问题：

$('select').first().change(function () {    
$sub.hide();
if (this.selectedIndex > 0)
   $sub.eq(this.selectedIndex - 1).show();
}).change();

工作小提琴

相关文章：