Wie füge ich eine versteckte Zeile mit einem onclick in eine Tabelle ein, kontinuierlich in Jquery

-2

Dies ist der HTML- und Jquery-Code für die Funktion. Es initialisiert die erste Zeile, also möchte ich jetzt die versteckte Zeile aufrufen, wenn ich auf die Schaltfläche klicke, so oft ich mit der gleichen Schaltfläche kann. Hier ist mein Code so weitWie füge ich eine versteckte Zeile mit einem onclick in eine Tabelle ein, kontinuierlich in Jquery

<!-- Jquery button click function --> 
 
    $(function() { 
 
     $('button').click(function() { 
 
      $('#other_tr').show() 
 
      var clone = $('#other_tr').clone; 
 
      $('#first_tr').after(clone) 
 
     }) 
 
    });

<html> 
 
<body> 
 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
    <table> 
 
     <thead> 
 
      <tr id="first_tr"> 
 
\t \t \t  <th>Unit price</th> 
 
\t \t \t  <th>Discount</th> 
 
\t \t \t  <th>Total</th> 
 
\t \t \t </tr> 
 
      
 
      <!-- hidden row --> 
 
      <tr id="other_tr" style="display: none;"> 
 
\t \t \t  <th>Unit price</th> 
 
\t \t \t  <th>Discount</th> 
 
\t \t \t  <th>Total</th> 
 
\t \t \t </tr> 
 
     </thead> 
 
    </table> 
 
    <button>Fetch Row</button> 
 
</body> 
 
</html>

Quelle

2017-07-12 Alex Okoro

Ich denke, das ist, was Sie sind, obwohl ich würde vorschlagen, eine leere tbody zu schaffen und die neuen Zeilen zu, dass das Anhängen.

$(function() { 
 
    $('button').click(function() { 
 
    var clone = $('#other_tr').clone(); 
 
    $('table thead').append(clone); 
 
    clone.show(); 
 
    }) 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<table> 
 
    <thead> 
 
    <tr id="first_tr"> 
 
     <th>Unit price</th> 
 
     <th>Discount</th> 
 
     <th>Total</th> 
 
    </tr> 
 

 
    <!-- hidden row --> 
 
    <tr id="other_tr" style="display: none;"> 
 
     <th>Unit price</th> 
 
     <th>Discount</th> 
 
     <th>Total</th> 
 
    </tr> 
 
    </thead> 
 
</table> 
 
<button>Fetch Row</button>

Quelle

2017-07-12 18:00:40 Steve

<!-- Jquery button click function --> 
 
    $(function() { 
 
     $('button').click(function() { 
 
      $('#other_tr').show(); 
 
      var clone = $('#other_tr').clone(); 
 
      $('#first_tr').after(clone); 
 
     }) 
 
    });

<html> 
 
<body> 
 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
    <table> 
 
     <thead> 
 
      <tr id="first_tr"> 
 
\t \t \t  <th>Unit price</th> 
 
\t \t \t  <th>Discount</th> 
 
\t \t \t  <th>Total</th> 
 
\t \t \t </tr> 
 
      
 
      <!-- hidden row --> 
 
      <tr id="other_tr" style="display: none;"> 
 
\t \t \t  <th>Unit price</th> 
 
\t \t \t  <th>Discount</th> 
 
\t \t \t  <th>Total</th> 
 
\t \t \t </tr> 
 
     </thead> 
 
    </table> 
 
    <button>Fetch Row</button> 
 
</body> 
 
</html>

Quelle

2017-07-12 18:02:09 Dij

Ich schlage vor, Sie other_tr beim Laden der Seite entfernen, entfernen Sie es id, und speichern Sie in Variablen.

Dann Klon, der variable jedesmal

$(function() { 
 

 
    var $tr = $('#other_tr').detach().show().removeAttr('id'); 
 

 
    $('button').click(function() { 
 
    $('#first_tr').after($tr.clone()); 
 
    }); 
 

 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<table> 
 
    <thead> 
 
    <tr id="first_tr"> 
 
     <th>Unit price</th> 
 
     <th>Discount</th> 
 
     <th>Total</th> 
 
    </tr> 
 

 
    <!-- hidden row --> 
 
    <tr id="other_tr" style="display: none;"> 
 
     <th>Unit price</th> 
 
     <th>Discount</th> 
 
     <th>Total</th> 
 
    </tr> 
 
    </thead> 
 
</table> 
 
<button>Fetch Row</button>

Quelle

2017-07-12 18:12:47 charlietfl

Wie füge ich eine versteckte Zeile mit einem onclick in eine Tabelle ein, kontinuierlich in Jquery

Antwort

Verwandte Themen