Jquery:如何在<TR>中禁用同级下拉列表值

Jquery: How to disable siblings dropdown value across <TR>

本文关键字:下拉列表 TR Jquery      更新时间:2023-09-26

我有这样的表格:

<table class="mytable">
<tr>
  <td>
    <select class="go">
      <option value="">--</option>
      <option value="1">1</option>
      <option value="2">2</option>
      <option value="3">3</option>
      <option value="4">4</option>
      <option value="5">5</option>
    </select>
  </td>
</tr>
<tr>
  <td>
    <select class="go">
      <option value="">--</option>
      <option value="1">1</option>
      <option value="2">2</option>
      <option value="3">3</option>
      <option value="4">4</option>
      <option value="5">5</option>
    </select>
  </td>
</tr>
<tr>
  <td>
    <select class="go">
      <option value="">--</option>
      <option value="1">1</option>
      <option value="2">2</option>
      <option value="3">3</option>
      <option value="4">4</option>
      <option value="5">5</option>
    </select>
  </td>
</tr>
<tr>
  <td>
    <select class="go">
      <option value="">--</option>
      <option value="1">1</option>
      <option value="2">2</option>
      <option value="3">3</option>
      <option value="4">4</option>
      <option value="5">5</option>
    </select>
  </td>
</tr>
<tr>
  <td>
    <select class="go">
      <option value="">--</option>
      <option value="1">1</option>
      <option value="2">2</option>
      <option value="3">3</option>
      <option value="4">4</option>
      <option value="5">5</option>
    </select>
  </td>
</tr>
</table>

我的jquery代码是这样的:

$(".go").change(function(){
    var selVal=[];
    $(".go").each(function(){
        selVal.push(this.value);
    });
    $(this).closest('tr').siblings(".go").find("option").removeAttr("disabled").filter(function(){
       var a=$(this).parent("select").val();
       return (($.inArray(this.value, selVal) > -1) && (this.value!=a))
    }).attr("disabled","disabled");
});

我的小提琴

如果我在此下拉列表中选择 1,如何禁用同级值,但我应该无法再次在另一个下拉列表中选择 1。这是在没有表格/td/的情况下完美工作的工作示例。我的要求是使用表 tr/td。我尝试使用:$(this).closest('tr').siblings(".go")但它不起作用。知道吗?

尝试将tr传递给.siblings()

$(this).closest("tr").siblings("tr").find("option")

JSFIDDLE http://jsfiddle.net/ev5qvprv/122/

您可以通过

先找到最近的表..然后找到除当前表之外的".go"来执行此操作

您使用的选择器不正确。

$(this).closest('tr').siblings(".go").find("option")

这不会给你任何东西,因为tr没有任何兄弟姐妹.go

对于选择器,您有两种解决方案:

$(this).closest('tr').siblings("tr").find("option")

$('table.mytable').find("option")