Maison >interface Web >Questions et réponses frontales >Comment changer dynamiquement la valeur de rowspan dans jquery
Méthode de changement : 1. Obtenez les éléments de cellule qui doivent traverser les lignes. La syntaxe "$("élément de cellule spécifié")" renverra un objet jquery contenant l'élément spécifié ; 2. Utilisez attr() pour modifier la durée de ligne ; l'attribut élément spécifié, la syntaxe est "objet élément spécifié.attr("rowspan","row value")".
L'environnement d'exploitation de ce tutoriel : système Windows 7, jquery version 1.10.2, ordinateur Dell G3.
rowspan est un attribut d'élément dans le langage HTML, utilisé pour spécifier le nombre de lignes qu'une cellule doit s'étendre.
Autrement dit, si une ligne s'étend sur deux lignes, cela signifie qu'elle occupera l'espace de deux lignes dans ce tableau. Il permet à une seule cellule du tableau de s’étendre sur la hauteur de plusieurs cellules ou lignes. L'attribut rowspan a la même fonction que les « cellules fusionnées » de la feuille de calcul dans Excel.
L'attribut rowspan peut être utilisé avec les éléments
Attribut rowspan Lorsqu'il est utilisé avec la balise
Lorsque l'attribut rowspan est utilisé avec la balise
Comment modifier la valeur de l'étendue de ligne dans jquery
1. Obtenez l'élément de cellule (td ou th) qui doit traverser la ligne
$("单元格元素")
renverra l'objet jquery contenant l'élément de cellule spécifié.
2. Utiliser attr() modifie l'attribut rowspan
元素对象.attr("rowspan","行数值")
Exemple :
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <script src="js/jquery-1.10.2.min.js"></script> <script> $(document).ready(function() { $("button").on("click", function() { $("#zk").attr("rowspan","3") }); }); </script> </head> <body class="ancestors"> <table border="1"> <tr> <th>商品</th> <th>价格</th> <th>假期折扣价</th> </tr> <tr> <td>T恤</td> <td>¥100</td> <td id="zk" rowspan="2">¥50</td> </tr> <tr> <td>牛仔褂</td> <td>¥250</td> </tr> <tr> <td>牛仔库</td> <td>¥150</td> </tr> </table><br> <button>改变rowspan值</button> </body> </html>
[Apprentissage recommandé : Tutoriel vidéo jQuery, Vidéo web front-end]
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!