jquery - 选中复选框时禁用选择

Question

我正在开发一个大型产品，对于我的一生，我无法让它发挥作用。我的问题是复选框和下拉框的 id 是动态的，所以我根本无法引用它们，也无法编辑 html 来给它们另一个。但是，我可以将它们包含在一个 Div 中并给它一个类名来引用它们（div.blaaah select）。

我一直在尝试研究和编写一些 JS 以在选中复选框时禁用下拉框，但由于引用问题我无法做到。

我还希望这可以在页面上应用许多区域（大约 65 个复选框禁用相应的下拉框对） - 例如：

因为每个 div 包含一个下拉框是包含复选框的 div 之后的下一个元素来禁用它我想我可以使用 .next() 或其他东西，但我的 Js 技能还没有达到标准！

我尝试了很多事情，但我所追求的一般想法是按照以下尝试的混乱思路：

$(".NACheck input").click(function() {
$(this).next(".importSelect select").disabled=true;
});

这是元素的层次结构：

<td>
  <div>
    <div class="checkNA">
      <table>
        <tbody>
          <tr>
            <td>
              <span>
                <table>
                  <tbody>
                    <tr>
                      <td>
                        <INPUT: CHECKBOX />
                      </td>
                      <td>
                      </td>
                    </tr>
                  </tbody>
                </table>
              </span>
            </td>
          </tr>
        </tbody>
      </table>
    </div>
  </div>
</td>
<td>
  <div>
    <div class="importSelect">
      <table>
        <tbody>
          <tr>
            <td>
              <span>
                <SELECT />
              </span>
            </td>
          </tr>
        </tbody>
      </table>
    </div>
  </div>
</td>
<td>
  <div>
    <div class="RelSelect">
      <table>
        <tbody>
          <tr>
            <td>
              <span>
                <SELECT />
              <span>
            </td>
          </tr>
        <tbody>
      </table>
    </div>
  </div>
</td>    

任何帮助将非常感激！谢谢你。

Answer 1

尝试这个 ：

$(".NACheck input").click(function() {
    $('select', $(this).parents('.container-of-each-line')).attr('disabled', 'disabled');
});

Answer 2

假设你select boxs在next two elements追求checkbox

向每个复选框添加onchange或onclick事件为

this.nextSibling.disabled = this.checked;
this.nextSibling.nextSibling.disabled = this.checked;

Answer 3

这可能会有所帮助：

$(this).parents('div containing checkbox').next().children().attr("disabled", true);

看看这个http://jsfiddle.net/ZBymu/