Bonsoir
Sous réserve d'avoir bien compris la question.
Vous ne pouvez pas agir directement sur l'événement "change", car il est appelé chaque fois que l'utilisateur modifie son choix. Il doit s'agir d'une fonction qui est appelée pour des conditions particulières.
À la limite, elle peut être appelée chaque fois que l'utilisateur fait un nouveau choix, mais pas lorsqu'il change d'avis. Exemple :
label { display: block; }
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40
| <label>
Choix 1 :
<input type="checkbox" value="10">
</label>
<label>
Choix 2 :
<input type="checkbox" value="20">
</label>
<label>
Choix 3 :
<input type="checkbox" value="30" disabled>
</label>
<label>
Choix 4 :
<input type="checkbox" value="40">
</label>
<label>
Choix 5 :
<input type="checkbox" value="50" disabled>
</label>
<label>
Choix 6 :
<input type="checkbox" value="60">
</label>
<label>
Choix 7 :
<input type="checkbox" value="70">
</label>
<label>
Choix 8 :
<input type="checkbox" value="80">
</label>
<label>
Choix 9 :
<input type="checkbox" value="90">
</label>
<label>
Choix 10 :
<input type="checkbox" value="100" disabled>
</label> |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48
| $( function(){ // forme abrégée de $(document).ready(function(){
var jObjBox = $( 'input[type="checkbox"]' );
function disableCheckbox( number ){
var n = number || 3;
if ( n < 0 ) {
n = 1;
}
if ( n > 3 ) {
n = 3;
}
/*
* On garde uniquement les éléments non
* disabled et non checked.
*/
var jObj = jObjBox.filter( function( i, item ){
return ( ! $( item ).prop( "checked" ) && ! $( item ).prop( "disabled" ) );
}),
jObjLength = jObj.length;
if ( n > jObjLength ) {
n = jObjLength;
}
/*
* On passe les n premiers objet jquery
* inclus dans jObj en disabled.
*/
for ( var i = 0; i < n; i++ ){
jObj.eq( i ).prop( "disabled", true );
}
}
jObjBox.on( "change", function(){
/*
* On agit uniquement lorsque l'utilisateur
* sélectionne un choix.
*/
if ( $( this ).prop( "checked" ) ) {
disableCheckbox( 1 );
}
});
}); |
Partager