Maison > Article > interface Web > Implémentation JS de l'exemple de code d'effet de sélection radio checkBox
Implémentation JS de l'exemple de code d'effet de sélection radio checkBox
- 小云云original
- 2018-02-27 13:38:565937parcourir
Cet article partage principalement avec vous l'effet de sélection radio de JS pour implémenter checkBoxd. En termes simples, il traverse toutes les cases à cocher checkBox. Si l'une est sélectionnée, désactivez les autres cases pour obtenir une sélection unique. , j'ai vu de nombreux blogs écrire des fonctions similaires, mais la plupart d'entre elles sont basées sur jquery. Ici, j'utilise du js natif pour implémenter cette fonction.
Publiez le code directement, comme suit :
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>
<table cellpadding="10" cellspacing="1" width="70%" border="1" align="center">
<tr >
<td align="center"> 个人税收居民身份声明</td>
</tr>
<tr >
<td>本人声明：</td>
</tr>
<tr >
<td>
<input type="checkBox" name="statement" id="1" onclick="selectCheckOne(this)">1.声明1 </td>
</tr>
<tr >
<td>
<input type="checkBox" name="statement" id="2" onclick="selectCheckOne(this)">2.声明2</td>
</tr>
<tr >
<td>
<input type="checkBox" name="statement" id="3" onclick="selectCheckOne(this)">3.声明3</td>
</tr>
</table>
</body>
<script>
function selectCheckOne(obj){
var checks = document.getElementsByName("statement");
if(obj.checked){
for( var i=0;i<checks.length;i++){
checks[i].checked=false;
}
obj.checked=true;
}else{
for( var i=0;i<checks.length;i++){
checks[i].checked=false;
}
}
}
</script>
</html>Recommandations associées :
Méthode Javascript pour obtenir des compétences d'effet de sélection radio de lien_javascript
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!