Utilisez la case à cocher pour faire fonctionner les tables layui

Cette fois, je vais vous apporter les précautions concernant l'utilisation de la case à cocher pour faire fonctionner les tables layui et de la case à cocher pour faire fonctionner les tables layui. Ce qui suit est un cas pratique, jetons un coup d'œil.

Dans la version précédente, la case à cocher par défaut doit en valoir la peine. La valeur par défaut est le mot "check", qui ne convient pas pour faire des sélections dans le formulaire et est heureusement difficile à modifier. , une fois layui mis à niveau, il peut prendre en charge le fait de ne pas écrire la valeur du nom pour s'adapter à l'opération de sélection dans le tableau.

1. Le numéro de version layui est la version v1.0.9 rls (actuellement la dernière version)

<span style="white-space:pre;">	</span><p class="layui-form">
	 <table class="layui-table">
	 <thead>
	  <tr>
	  <th><input type="checkbox" name="" lay-skin="primary" lay-filter="allChoose"></th>
	  <th>人物</th>
	  <th>民族</th>
	  <th>出场时间</th>
	  <th>格言</th>
	  </tr> 
	 </thead>
	 <tbody>
	  <tr>
	  <td><input type="checkbox" name="" lay-skin="primary"></td>
	  <td>贤心</td>
	  <td>汉族</td>
	  <td>1989-10-14</td>
	  <td>人生似修行</td>
	  </tr>
	  <tr>
	  <td><input type="checkbox" name="" lay-skin="primary"></td>
	  <td>张爱玲</td>
	  <td>汉族</td>
	  <td>1920-09-30</td>
	  <td>于千万人之中遇见你所遇见的人，于千万年之中，时间的无涯的荒野里…</td>
	  </tr>
	 </tbody>
	 </table>
	</p>
	<script type="text/javascript" src="plugins/layui/lay/dest/layui.all.js"></script>
	<script type="text/javascript">
		var $ = layui.jquery,
			form = layui.form();
		//全选
		form.on('checkbox(allChoose)', function(data){
		 var child = $(data.elem).parents('table').find('tbody input[type="checkbox"]');
		 child.each(function(index, item){
		  item.checked = data.elem.checked;
		 });
		 form.render('checkbox');
		});
	</script>

2, le numéro de version est v1.0.9. Les versions avant rls doivent mettre à jour plusieurs fichiers

(a) fichier layui.all.js dans layuilaydest

(b ) layuuilay Le fichier form.js dans les moduless

(c) Le fichier layui.css dans layuicss

écrase les trois fichiers ci-dessus de la dernière version à l'original version , vous pouvez facilement implémenter le style de case à cocher.

Je pense que vous maîtrisez la méthode après avoir lu le cas dans cet article. Pour des informations plus intéressantes, veuillez prêter attention aux autres articles connexes sur le site Web chinois de php !

Lecture recommandée :

Comment $set met à jour le tableau dans vue.js

Comment JQuery sélectionne-t-il la valeur spécifiée dans la sélection composant

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!