Maison > interface Web > js tutoriel > le corps du texte

Comment utiliser jquery pour tout sélectionner et supprimer

藏色散人
Libérer: 2021-02-05 18:00:32
original
1932 Les gens l'ont consulté

Comment utiliser jquery pour tout sélectionner et supprimer : créez d'abord un exemple de fichier de code html ; puis modifiez le code jquery ; enfin passez "$(".seleAll").on("click", function() {. ..}" méthode pour réaliser la fonction de suppression de tout sélectionner.

Comment utiliser jquery pour tout sélectionner et supprimer

L'environnement d'exploitation de ce tutoriel : système Windows 7, jquery version 1.10.0. , ordinateur Dell G3.

Recommandé : "Tutoriel vidéo jquery"

Utilisez jquery pour implémenter la fonction de suppression de tout sélectionner

code html

<div class="box">
<ul>
<li><input type="checkbox" /> 少小离家胖了回</li>
<li><input type="checkbox" /> 乡音无改肉成堆</li>
<li><input type="checkbox" /> 儿童相见不相识</li>
<li><input type="checkbox" /> 笑问胖子你是谁</li>
</ul>
<div>
<input type="button" class="seleAll" value="全选" />
<input type="button" class="reverse" value="反选" />
<input type="button" class="op" value="全不选" />
<input type="button" class="del" value="删除" />
</div>
</div>
Copier après la connexion

code jquery

<script src="https://cdn.staticfile.org/jquery/1.10.2/jquery.min.js"></script>
<script type="text/javascript">
//全选
$(".seleAll").on("click", function() {
var oin = $("input[type=&#39;checkbox&#39;]")
oin.each(function() {
$(this).prop("checked", true)
})
})
//全不选
$(".op").on("click", function() {
var oin = $("input[type=&#39;checkbox&#39;]")
oin.each(function() {
$(this).prop("checked", false)
})
})
// 反选 
$(".reverse").on("click", function() {
// 获取节点 
var oin = $("input[type=&#39;checkbox&#39;]")
oin.each(function() {
this.checked = !this.checked
})
})
// 批量删除 
$(".del").on("click", function() {
var sele = $(":checkbox:checked")
if(sele.length > 0) {
sele.each(function() {
$(this).parent().remove()
})
} else {
alert("至少选一个数据")
}
})
</script>
Copier après la connexion

Effet d'exécution :

Comment utiliser jquery pour tout sélectionner et supprimer

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!

Étiquettes associées:
source:php.cn
Déclaration de ce site Web
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
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal
À propos de nous Clause de non-responsabilité Sitemap
Site Web PHP chinois:Formation PHP en ligne sur le bien-être public,Aidez les apprenants PHP à grandir rapidement!