Heim > Web-Frontend > js-Tutorial > Hauptteil

Beispielcode für die Funktion „Alle Stile auswählen' im Laui-Tabellen-Kontrollkästchen

小云云
Freigeben: 2018-03-09 09:23:36
Original
2631 Leute haben es durchsucht

Dieser Artikel zeigt Ihnen hauptsächlich ein Beispiel für die Auswahl aller Stile und Funktionen des Laui-Tabellen-Kontrollkästchens. Ich hoffe, es kann Ihnen helfen. In der vorherigen Version muss das Standard-Kontrollkästchen einen Wert haben. Der Standardwert ist nicht für die Auswahl im Formular geeignet und lässt sich glücklicherweise nicht ändern, nachdem Layui aktualisiert wurde Namenswert, um sich an die Auswahloperation in der Tabelle anzupassen.

1. Die Layui-Versionsnummer ist v1.0.9 rls (derzeit die neueste 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>
Nach dem Login kopieren

2. Die Versionsnummer ist v1.0.9 rls und frühere Versionen müssen es sein ein paar Mal aktualisiert Datei

(a) Datei „layui.all.js“ in „layuilaydest“

(b) Datei „form.js“ in „layuilaymodules“

(c) Datei „layui.css“ in Layuicss-Datei

Überschreiben Sie die oben genannten drei Dateien von der neuesten Version mit der Originalversion, und Sie können den Kontrollkästchenstil problemlos implementieren.

Verwandte Empfehlungen:

JS-Implementierung des CheckBox-Einzelauswahleffekt-Beispielcodes

Zwei Spalten von CheckBox in der Tabelle können Nur ausgewählt werden Ein jQuery-Code

So verschönern Sie den Stil von HTML-Kontrollkästchen und -Radio

Das obige ist der detaillierte Inhalt vonBeispielcode für die Funktion „Alle Stile auswählen' im Laui-Tabellen-Kontrollkästchen. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage