Javascript 从表内的下拉列表中获取选定值

目前，我可以从表中下拉列表中的event onchange中获取所选值，但它仅适用于表的第一行。如果我要更改其他行的值，它仍然会从第一行获取值

这是我的密码：

<table class="sortable" border="1" id="table">
    <thead>
        <tr>
            <th>Employee Serial</th>
            <th>Grade</th>

        </tr>
    </thead>
    <tbody>
        @foreach (var item in Model)
        {
            <tr style="font-size:11px">
                <td>@item.empSerial</td>

                <td ALIGN="center">
                    <select onchange="getSelValue()" id="drpTechnical" class="testerDrop" style="height:20px; width:100px; text-align-last:center; cursor:pointer">
                        <option value=@item.technicalComp>@item.grade1</option>
                        <option value=@item.empSerial>0</option>
                        <option value=@item.empSerial>1</option>
                        <option value=@item.empSerial>2</option>
                        <option value=@item.empSerial>3</option>
                        <option value=@item.empSerial>4</option>
                    </select>
                </td>                    

            </tr>
        }
    </tbody>
</table>

---

我认为您犯了一个小错误，您为select标记设置的id称为“drpTechnical”，但在函数中，您尝试调用id为“getSelValue”的元素

尝试更改代码，如下所示 代码更新：

 <td ALIGN="center">
   <select onchange="getSelValue(this)" class="testerDrop" 
     style="height:20px; width:100px; text-align-last:center; cursor:pointer">
                    <option value=@item.technicalComp>@item.grade1</option>
                    <option value=@item.empSerial>0</option>
                    <option value=@item.empSerial>1</option>
                    <option value=@item.empSerial>2</option>
                    <option value=@item.empSerial>3</option>
                    <option value=@item.empSerial>4</option>
                </select>
            </td>     

<script>
function getSelValue(obj) {        
    alert(obj.value)         
}
</script>

@项目1.1等级
0
1.
2.
3.
4.
函数getSelValue（obj）{
警报（目标值）
}

document.getElementById始终只返回具有此ID的第一个元素，因为ID应该是唯一的

您想要的是从已更改的元素中获取id。所以你需要

这个

function getSelValue(this) {        
    alert(this.value)         
} 

你的桌子应该是这样的

<td ALIGN="center">
  <select onchange="getSelValue(this)" id="drpTechnical" class="testerDrop" style="height:20px; width:100px; text-align-last:center; cursor:pointer">
    <option value=@item.technicalComp>@item.grade1</option>
    <option value=@item.empSerial>0</option>
    <option value=@item.empSerial>1</option>
    <option value=@item.empSerial>2</option>
    <option value=@item.empSerial>3</option>
    <option value=@item.empSerial>4</option>
  </select>
</td>  


@项目1.1等级
0
1.
2.
3.
4.

函数getSelValue（e）{
警报（e.value）
}

员工序列号
等级
@item.empSerial
@项目1.1等级
0
1.
2.
3.
4.
传递当前元素内容
this
即
onchange=“getSelValue（this）”
和函数中的
警报（this.value）
，因为ID应该是唯一的，所以这不起作用。这将始终返回第一个select的值。啊，是的，没错，您可以将select对象传递给函数，然后使用obj.value获取值，或者您可以将id改为类，而不是将id改为类。这将返回每个select的值。你的第一个想法就是我在回答中所做的
<td ALIGN="center">
  <select onchange="getSelValue(this)" id="drpTechnical" class="testerDrop" style="height:20px; width:100px; text-align-last:center; cursor:pointer">
    <option value=@item.technicalComp>@item.grade1</option>
    <option value=@item.empSerial>0</option>
    <option value=@item.empSerial>1</option>
    <option value=@item.empSerial>2</option>
    <option value=@item.empSerial>3</option>
    <option value=@item.empSerial>4</option>
  </select>
</td>