Maison >interface Web >js tutoriel >rangée de table de clone jQuery et rendre vide
Utilisez rapidement jQuery pour cloner les lignes de table et effacer les extraits de code de contenu:
<code class="language-javascript">var clonedRow = $('tbody tr:first').clone(); clonedRow.find('input').val(''); $(this).prev().find('table tbody').append(clonedRow);</code>
Les lignes de table de clone utilisant jQuery sont très simples, vous pouvez utiliser la méthode clone()
pour copier les lignes. Voici un exemple de base:
<code class="language-javascript">$("#tableID tbody").append($("#tableID tbody tr:last").clone());</code>
Cet exemple clones la dernière ligne de la table avec ID "TableID" et l'ajoute au corps de la table.
peut former des lignes clonées et leur contenu est effacé. Après le clonage de la ligne, vous pouvez utiliser la méthode find()
pour sélectionner l'élément enfant, puis effacer son contenu. Voici un exemple:
<code class="language-javascript">var clonedRow = $("#tableID tbody tr:last").clone(); clonedRow.find("input").val(""); $("#tableID tbody").append(clonedRow);</code>
Cet exemple efface les champs d'entrée dans la ligne clonée avant d'ajouter la ligne clonée au corps de la table.
L'ID de ligne cloné peut être modifié à l'aide de la méthode attr()
. Voici un exemple:
<code class="language-javascript">var clonedRow = $("#tableID tbody tr:last").clone(); clonedRow.attr("id", "newID"); $("#tableID tbody").append(clonedRow);</code>
Cet exemple modifie la ligne clonée en "NewId" avant d'ajouter sa ligne clonée au corps de la table.
pouvez-vous cloner une ligne de table et l'ajouter à une autre table. Sélectionnez simplement une autre table lors de l'ajout de la ligne de clone. Voici un exemple:
<code class="language-javascript">var clonedRow = $("#tableID1 tbody tr:last").clone(); $("#tableID2 tbody").append(clonedRow);</code>
Cet exemple clones la dernière ligne de la table avec ID "TableID1" et l'ajoute à la table avec ID "TableID2".
Vous pouvez utiliser les méthodes text()
ou html()
pour modifier le contenu de la ligne de clone. Voici un exemple:
<code class="language-javascript">var clonedRow = $("#tableID tbody tr:last").clone(); clonedRow.find("td:first").text("新内容"); $("#tableID tbody").append(clonedRow);</code>
Cet exemple modifie le contenu de la première cellule dans la ligne clonée en "nouveau contenu" avant d'ajouter la ligne clonée au corps de la table.
pouvez-vous cloner une ligne de table et supprimer certaines de ces cellules. La cellule sélectionnée peut être supprimée à l'aide de la méthode remove()
. Voici un exemple:
<code class="language-javascript">var clonedRow = $("#tableID tbody tr:last").clone(); clonedRow.find("td:last").remove(); $("#tableID tbody").append(clonedRow);</code>
Cet exemple supprime la dernière cellule de la ligne clonée avant d'ajouter la ligne clonée au corps de la table.
Vous pouvez utiliser la méthode append()
pour ajouter de nouvelles cellules à la ligne clonée. Voici un exemple:
<code class="language-javascript">var clonedRow = $("#tableID tbody tr:last").clone(); clonedRow.append("<td>新单元格</td>"); $("#tableID tbody").append(clonedRow);</code>
Cet exemple ajoute une nouvelle cellule avec le contenu de la "nouvelle cellule" à la ligne clonée avant d'ajouter la ligne clonée au corps de la table.
Vous pouvez utiliser les méthodes addClass()
ou removeClass()
pour modifier la classe de la ligne clonée. Voici un exemple:
<code class="language-javascript">var clonedRow = $("#tableID tbody tr:last").clone(); clonedRow.removeClass("旧类").addClass("新类"); $("#tableID tbody").append(clonedRow);</code>
Cet exemple supprime la classe "ancienne classe" de la ligne clonée et ajoute la classe "nouvelle classe" avant d'ajouter la ligne clonée au corps de la table.
Vous pouvez utiliser la méthode css()
pour modifier le style de la ligne clonée. Voici un exemple:
<code class="language-javascript">var clonedRow = $('tbody tr:first').clone(); clonedRow.find('input').val(''); $(this).prev().find('table tbody').append(clonedRow);</code>
Cet exemple modifie la couleur d'arrière-plan de la ligne clonée en jaune avant d'ajouter la ligne clonée au corps de la table.
Vous pouvez utiliser la méthode on()
pour ajouter des gestionnaires d'événements aux lignes clonées. Voici un exemple:
<code class="language-javascript">$("#tableID tbody").append($("#tableID tbody tr:last").clone());</code>
Cet exemple ajoute un gestionnaire d'événements de clic à la ligne clonée avant d'ajouter la ligne clonée au corps de la table. Lorsqu'une ligne de clone est cliquée, une boîte d'avertissement avec le message "La ligne de clone est cliquée!"
Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!