Jquery 将立即连接下拉列表设置为当前下拉列表

这是我的HTML代码

   <table>
   <tr>
   <select class="dropdown">
   <option value="">Select answer</option>
   <option value="1" selected="selected">A</option>
   <option value="2">B</option>
   <option value="3">C</option>
   </select>
   </td>
   <td>
   <select class="dropdown">
   <option value="">Select answer</option>
   <option value="1" >Yes</option>
   <option value="2">No</option>
   <option value="3">N.A.</option>
   </select>
   </td>
   </tr>
   <td>
   <select class="dropdown">
   <option value="">Select answer</option>
   <option value="1" >Yes</option>
   <option value="2">No</option>
   <option value="3">N.A.</option>
   </select>
   </td>
   </table>

我想基于第一个下拉框的值启用立即下一个下拉值。请有人帮忙。

试试这把小提琴：

---

在此示例中，第二个下拉列表仅在选择

B

时启用，第三个下拉列表在选择

C

时启用。但是我不确定您想要什么。

根据您的需要进行修改

$("select.dropdown").change(function(){
if($(this).val()==='2')
{  
   $(this).nextAll().find("select:first").prop("disabled",true);
}

});

另一种方法：

var $selects = $('table tr select');

$selects.each(function(i) {
    $(this).prop('disabled', i != 0)
           .bind('change', function() {
                $selects.eq(i + 1).prop('disabled', false);
            });
});

（）

---

注意：缺少

和

已插入。
如果删除
最近的（）
，该怎么办？
nextAll（）
应该已经返回了正确的选择框。
var $selects = $('table tr select');

$selects.each(function(i) {
    $(this).prop('disabled', i != 0)
           .bind('change', function() {
                $selects.eq(i + 1).prop('disabled', false);
            });
});