Est-il possible de désactiver les clics checkbox
via CSS
. Mais en gardant la fonctionnalité de checkbox
intacte, nous pouvons donc définir ses valeurs de manière dynamique en utilisant Javascript
. Je n'ai pas pu trouver une solution adéquate.
pointer-events:none
n'a pas marché
Si pointer-events
n'est pas pris en charge par votre navigateur, alors non, pas seulement avec css.
juste la solution html
sera comme ça.
<input type="checkbox" disabled="disabled" id="checkBox"/>
si vous souhaitez faire ceci en utilisant javascript
document.getElementById("checkBox").disabled=true;
Vous pouvez mettre une div transparente en haut de la case à cocher pour la rendre non cliquable en basculant une classe sur l'objet parent . Quelque chose comme ça ...
.container{
position:relative;
display:block;
}
.cover{
width:100%;
height:100%;
background:transparent;
position:absolute;
z-index:2;
top:0;
left:0;
display:none;
}
.container.disable-checkbox .cover{
display:block;
}
<div class="container">
<div class="cover"></div>
<input type="checkbox"/> "clickable"
</div>
<div class="container disable-checkbox">
<div class="cover"></div>
<input type="checkbox"/> "un-clickable"
</div>
Vous avez probablement besoin de javascript pour cela. Vous pouvez utiliser cet exemple si vous utilisez jQuery:
$('input[type="checkbox"]').on('click', function(ev){
ev.preventDefault();
})
Ou une méthode rapide et sale, ajoutez un attribut onClick à la case à cocher comme ceci:
<input type="checkbox" onClick="return false;">
Ceci est possible en définissant pointer-events: none
sur un élément parent de la case à cocher :)
Non, cela ne semble pas possible.
Vous devrez peut-être CACHER. Utilisez input type = "hidden" pour stocker des informations et les traiter avec JS.