Maison  >  Article  >  interface Web  >  Comment changer dynamiquement la valeur de rowspan dans jquery

Comment changer dynamiquement la valeur de rowspan dans jquery

青灯夜游
青灯夜游original
2022-05-23 17:42:103718parcourir

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")".

Comment changer dynamiquement la valeur de rowspan dans jquery

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

et
  • Attribut rowspan Lorsqu'il est utilisé avec la balise

    , l'attribut rowspan détermine le nombre standard de cellules qu'il doit couvrir.
  • Lorsque l'attribut rowspan est utilisé avec la balise

    , l'attribut rowspan détermine le nombre de cellules d'en-tête qu'il doit couvrir.

    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>

    Comment changer dynamiquement la valeur de rowspan dans jquery

    [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!

Déclaration:
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn