Question

在我的表格中，我有一个按钮，当单击该按钮时，该按钮只能扩展一行，但是现在，当我单击该按钮时，它将扩展所有行。谁能帮帮我吗？预先感谢。

HTML：

   <table class="table">
      <thead>
         <tr>
          <th>Varenummer</th>
          <th>Beskrivelse</th>
          <th></th>
          </tr>
      </thead>
  <tbody id="ResultProduct">
    <tr class="RMAJS">
       <td id="varnummer" name="varnummer">61A6MAT3</td>
       <td id="Beskrivelse" name="Beskrivelse">Lenovo T24</td>
       <td><button type="submit" class="sendRMA">Anmod om RMA</button></td>
    </tr>
   <tr style="display:none;" class="section">
    <td>test</td>
   </tr>

 <tr class="RMAJS">
           <td id="varnummer" name="varnummer">AMAT3</td>
           <td id="Beskrivelse" name="Beskrivelse">Dell</td>
           <td><button type="submit" class="sendRMA">Anmod om RMA</button></td>
  </tr>  
  <tr style="display:none;" class="section">
        <td>test</td>
  </tr>
  </tbody>
    </table>

JS：

    $('#ResultProduct').on("click", ".RMAJS", function () {

        $('.section').closest('tr').toggle("slow");

    });

Answer 1

$('#ResultProduct > .RMAJS').each( function( i, el) {
    $(el).on("click", function (e) {
        $(this).next('.section').toggle("slow");
        // or $(this).next('.section').css("display","");

    });

});

就是这样，接下来要使用...

Answer 2

current_period

有效的jsfiddle https://jsfiddle.net/xk82zagv/

谢谢。

Answer 3

这应该有效。您在HTML代码中有重复的ID。我使用产品编号作为唯一ID

 $('.RMAJS').on("click", ".sendRMA", function () {
        var showid = $(this).attr("data-id");
        $('#' + showid ).closest('tr').toggle("slow");

    });

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<table class="table">
      <thead>
         <tr>
          <th>Varenummer</th>
          <th>Beskrivelse</th>
          <th></th>
          </tr>
      </thead>
  <tbody id="ResultProduct">
    <tr class="RMAJS">
       <td name="varnummer">61A6MAT3</td>
       <td name="Beskrivelse">Lenovo T24</td>
       <td><button data-id="61A6MAT3" class="sendRMA">Anmod om RMA</button></td>
    </tr>
   <tr id="61A6MAT3" style="display:none;" class="section">
    <td>test</td>
   </tr>

 <tr class="RMAJS">
           <td name="varnummer">AMAT3</td>
           <td name="Beskrivelse">Dell</td>
           <td><button data-id="AMAT3" class="sendRMA">Anmod om RMA</button></td>
  </tr>  
  <tr id="AMAT3" style="display:none;" class="section">
        <td>test</td>
  </tr>
  </tbody>
    </table>

单击按钮时仅展开一行

3 个答案: