Question

我有两个不同的表彼此相邻。我用它们做了一些事情，一切顺利，但是当我想要删除其中一个（它们的父母的第一个孩子）时，它会删除它们。我尝试了很多方法来选择第一个元素，例如：:first-child, :first, .first(), :nth-child(1), eq(0) ...但如果我使用.remove()，它们都不起作用。另一方面，当我使用例如.empty()时，它可以工作。所以这是我的问题：导致这个问题的原因是什么？

<div class="calendar_wrapper_border ">
    <table>
        <tr>
            <td>
                something here
            </td>
        </tr>
    </table>
    <table>
        <tr>
            <td>
                something here
            </td>
        </tr>
    </table>
</div>
<script>
    //doesn't work
    $('.calendar_wrapper_border table:first-child').remove();
    //does work
    $('.calendar_wrapper_border table:first-child').empty();
</script>

正如我所说，它不适用于任何'第一'选择器。还有一件事是，两个表都是使用JQuery生成的，并附加到该DIV。但对我来说没有意义，.empty（）可以工作，但.remove（）会删除两个表。如果有人能给我解释我的错误，我可能会感谢你。

我将为您提供此HTML代码的整个结构。



<div class="calendar_wrapper_border">
 <table class="calendar">
  <tbody>
    <tr class="names"> 
      <td class="day             name_of_day">Po</td> 
      <td class="day name_of_day">Út</td> 
      <td class="day name_of_day">St</td> 
      <td class="day name_of_day">Čt</td> 
      <td class="day name_of_day">Pá</td> 
      <td class="day name_of_day">So</td> 
      <td class="day name_of_day">Ne</td>
    </tr>
    <tr> 
      <td class="day disabled" date="30-3-2015">30</td> 
      <td class="day disabled" date="31-3-2015">31</td> 
      <td class="day" date="1-4-2015">1</td> 
      <td class="day" date="2-4-2015">2</td> 
      <td class="day" date="3-4-2015">3</td> 
      <td class="day" date="4-4-2015">4</td> 
      <td class="day" date="5-4-2015">5</td>
    </tr>
    <tr> 
      <td class="day" date="6-4-2015">6</td> 
      <td class="day" date="7-4-2015">7</td> 
      <td class="day" date="8-4-2015">8</td> 
      <td class="day" date="9-4-2015">9</td> 
      <td class="day" date="10-4-2015">10</td> 
      <td class="day" date="11-4-2015">11</td> 
      <td class="day" date="12-4-2015">12</td>
    </tr>
    <tr> 
      <td class="day" date="13-4-2015">13</td>
      <td class="day" date="14-4-2015">14</td> 
      <td class="day" date="15-4-2015">15</td> 
      <td class="day" date="16-4-2015">16</td> 
      <td class="day" date="17-4-2015">17</td> 
      <td class="day" date="18-4-2015">18</td> 
      <td class="day" date="19-4-2015">19</td>
    </tr>
    <tr> 
      <td class="day" date="20-4-2015">20</td> 
      <td class="day" date="21-4-2015">21</td> 
      <td class="day" date="22-4-2015">22</td> 
      <td class="day" date="23-4-2015">23</td> 
      <td class="day" date="24-4-2015">24</td> 
      <td class="day" date="25-4-2015">25</td> 
      <td class="day" date="26-4-2015">26</td>
    </tr>
    <tr> 
      <td class="day selected" date="27-4-2015">27</td> 
      <td class="day" date="28-4-2015">28</td> 
      <td class="day" date="29-4-2015">29</td> 
      <td class="day" date="30-4-2015">30</td> 
      <td class="day disabled" date="1-1-2015">1</td> 
      <td class="day disabled" date="2-1-2015">2</td> 
      <td class="day disabled" date="3-1-2015">3</td>
    </tr>
  </tbody>
  </table>
  <table class="calendar">
  <tbody>
    <tr class="names"> 
      <td class="day             name_of_day">Po</td> 
      <td class="day name_of_day">Út</td>
      <td class="day name_of_day">St</td> 
      <td class="day name_of_day">Čt</td> 
      <td class="day name_of_day">Pá</td> 
      <td class="day name_of_day">So</td> 
      <td class="day name_of_day">Ne</td>
    </tr>
    <tr> 
      <td class="day disabled" date="30-3-2015">30</td> 
      <td class="day disabled" date="31-3-2015">31</td> 
      <td class="day" date="1-4-2015">1</td> 
      <td class="day" date="2-4-2015">2</td> 
      <td class="day" date="3-4-2015">3</td> 
      <td class="day" date="4-4-2015">4</td> 
      <td class="day" date="5-4-2015">5</td>
    </tr>
    <tr> 
      <td class="day" date="6-4-2015">6</td> 
      <td class="day" date="7-4-2015">7</td> 
      <td class="day" date="8-4-2015">8</td> 
      <td class="day" date="9-4-2015">9</td> 
      <td class="day" date="10-4-2015">10</td> 
      <td class="day" date="11-4-2015">11</td> 
      <td class="day" date="12-4-2015">12</td>
    </tr>
    <tr> 
      <td class="day" date="13-4-2015">13</td> 
      <td class="day" date="14-4-2015">14</td> 
      <td class="day" date="15-4-2015">15</td> 
      <td class="day" date="16-4-2015">16</td> 
      <td class="day" date="17-4-2015">17</td>
      <td class="day" date="18-4-2015">18</td> 
      <td class="day" date="19-4-2015">19</td>
    </tr>
    <tr> 
      <td class="day" date="20-4-2015">20</td> 
      <td class="day" date="21-4-2015">21</td> 
      <td class="day" date="22-4-2015">22</td> 
      <td class="day" date="23-4-2015">23</td> 
      <td class="day" date="24-4-2015">24</td> 
      <td class="day" date="25-4-2015">25</td> 
      <td class="day" date="26-4-2015">26</td>
    </tr>
    <tr> 
      <td class="day selected" date="27-4-2015">27</td> 
      <td class="day" date="28-4-2015">28</td> 
      <td class="day" date="29-4-2015">29</td> 
      <td class="day" date="30-4-2015">30</td> 
      <td class="day disabled" date="1-1-2015">1</td> 
      <td class="day disabled" date="2-1-2015">2</td> 
      <td class="day disabled" date="3-1-2015">3</td>
    </tr>
  </tbody>
 </table>
 </div>

我想删除其中一个表，但没有成功。

Answer 1

好吧，当我试图重现这个问题时，我发现这个问题出在哪里。我应该尽可能多地为此投票。问题是，我在.animate（）函数的回调中调用了这个函数。但是这个函数运行了2次，因为它是动画两个表（肯定！），这就是为什么它总是删除它们。第一个动画 - ＆gt;删除第一个表;第二个动画 - ＆gt;删除第一个表（在这种情况下只剩下一个表）。这就是我如何发现我是白痴:)抱歉浪费你的时间。

JQuery .remove（）删除的元素多于选中的元素

1 个答案: