Fatal编程技术网
  • jquery/
  • jQuery无法使用我的代码

jQuery无法使用我的代码

jquery

jQuery无法使用我的代码,jquery,this,Jquery,This,我有以下标记 <tbody> <tr> <td class="expand">Showroom area - New Display Zone</td> <td>300</td> <td>350</td> <td class="shortfall">50</td>

我有以下标记

<tbody>
        <tr>
            <td class="expand">Showroom area - New Display Zone</td>
            <td>300</td>
            <td>350</td>
            <td class="shortfall">50</td>
        </tr>
        <tr class="hidden">
            <td>Core Display</td>
            <td>9</td>
            <td>10</td>
            <td>1</td>
        </tr>
        <tr class="hidden">
            <td>R8</td>
            <td>0</td>
            <td>0</td>
            <td>1</td>
        </tr>
        <tr class="hidden">
            <td>Highlight Car</td>
            <td>1</td>
            <td>1</td>
            <td>0</td>
        </tr>
        <tr>
            <td class="expand">Showroom - Handover Bay</td>
            <td>300</td>
            <td>350</td>
            <td class="shortfall">50</td>
        </tr>
        <tr class="hidden">
            <td>Core Display</td>
            <td>9</td>
            <td>10</td>
            <td>1</td>
        </tr>
        <tr class="hidden">
            <td>R8</td>
            <td>0</td>
            <td>0</td>
            <td>1</td>
        </tr>
        <tr class="hidden">
            <td>Highlight Car</td>
            <td>1</td>
            <td>1</td>
            <td>0</td>
        </tr>
我想让这段代码切换前3个tr.hidden类，因为它与第一个td.expand类直接相关，但运行这段代码会切换所有tr.hidden类以显示

有人知道我做错了什么吗？

你想用
parent（）
而不是
parents（）
你想用
parent（）
而不是
parents（）
基本上，你做错的不是告诉jQuery你只想处理一些
tr.hidden
元素。您还使用了
家长
（复数），几乎可以肯定您想要
家长
（单数）

可以使用
nextUntil
收集元素，直到条件匹配为止。在这种情况下，您可以使用
nextUntil
收集行，直到找到一个未
tr.hidden
的行。因此：

$(this).parent().nextUntil(':not(tr.hidden)').toggle();
|

交替-这将是我的首选解决方案-您可能会考虑稍微改变结构，并使用多个<代码> TBOSUT/CODEN>元素，这些扩展/折叠组中的每一个元素：

<tbody>
  <tr>
    <td class="expand">...</td>
    ...
  </tr>
  <tr class="hidden">
  ...
  </tr>
  ...
</tbody>
<tbody>
  <tr>
    <td class="expand">...</td>
    ...
  </tr>
  <tr class="hidden">
  ...
  </tr>
  ...
</tbody>
|

基本上，你做错了的是没有告诉jQuery你只想处理一些
tr.hidden
元素。您还使用了
家长
（复数），几乎可以肯定您想要
家长
（单数）

可以使用
nextUntil
收集元素，直到条件匹配为止。在这种情况下，您可以使用
nextUntil
收集行，直到找到一个未
tr.hidden
的行。因此：

$(this).parent().nextUntil(':not(tr.hidden)').toggle();
|

交替-这将是我的首选解决方案-您可能会考虑稍微改变结构，并使用多个<代码> TBOSUT/CODEN>元素，这些扩展/折叠组中的每一个元素：

<tbody>
  <tr>
    <td class="expand">...</td>
    ...
  </tr>
  <tr class="hidden">
  ...
  </tr>
  ...
</tbody>
<tbody>
  <tr>
    <td class="expand">...</td>
    ...
  </tr>
  <tr class="hidden">
  ...
  </tr>
  ...
</tbody>
|

+1，但如果在
元素之间存在不匹配的
。隐藏
。展开
元素，则这将不起作用。您可以使用第二个参数
nextUntil
来过滤匹配的选择，以仅包括匹配
的元素。hidden
@jamesalardice:似乎可以与给定的结构配合使用，我怀疑这是一个相当规则的结构（摘要行后跟详细信息行，摘要行后跟详细信息行）。同意，它与问题中的结构配合得很好。我刚刚指出，如果要更改（可能是摘要行之后的另一行，但在
.hidden
行之前），那么您的示例将不起作用，但是
nextUntil（'.expand'，'.hidden'）
会起作用。@jamesalardice:除了
expand
类位于
td
上，而不是
tr
上。但是
.nextUntil（'tr:has（td.expand）'，.hidden'）
会起作用，谢谢，知道它很有用。对于这类事情，我肯定倾向于使用多个
tbody
元素。我喜欢用容器装这些东西。：-）哦，是的，那会教我正确地阅读代码！是的，我也最喜欢你的
tbody
解决方案：）+1，但是如果在
元素之间存在不匹配的
。隐藏的
。展开
元素，这就行不通了。您可以使用第二个参数
nextUntil
来过滤匹配的选择，以仅包括匹配
的元素。hidden
@jamesalardice:似乎可以与给定的结构配合使用，我怀疑这是一个相当规则的结构（摘要行后跟详细信息行，摘要行后跟详细信息行）。同意，它与问题中的结构配合得很好。我刚刚指出，如果要更改（可能是摘要行之后的另一行，但在
.hidden
行之前），那么您的示例将不起作用，但是
nextUntil（'.expand'，'.hidden'）
会起作用。@jamesalardice:除了
expand
类位于
td
上，而不是
tr
上。但是
.nextUntil（'tr:has（td.expand）'，.hidden'）
会起作用，谢谢，知道它很有用。对于这类事情，我肯定倾向于使用多个
tbody
元素。我喜欢用容器装这些东西。：-）哦，是的，那会教我正确地阅读代码！是的，我也最喜欢你的
tbody
解决方案：）