javascript - seleccionados - limpiar checkbox jquery

jQuery checkbox cambiar y hacer clic en evento

Question

yo tengo

<input type="checkbox" id="checkbox1" /> <br />
<input type="text" id="textbox1" />

y

$(document).ready(function() {
//set initial state.
$(''#textbox1'').val($(this).is('':checked''));
$(''#checkbox1'').change(function() {
$(''#textbox1'').val($(this).is('':checked''));
});
$(''#checkbox1'').click(function() {
if (!$(this).is('':checked'')) {
return confirm("Are you sure?");
}
});
});

Enlace JSFIDDLE

Aquí el evento modificado actualiza el valor del cuadro de texto con el estado de la casilla de verificación. Uso el evento clic para confirmar la acción al desmarcar. Si el usuario selecciona cancelar, la marca de verificación se restaura pero el cambio incluso se dispara antes de que la confirmación deje las cosas en un estado inconsistente (el cuadro de texto dice falso cuando la casilla de verificación está marcada). ¿Cómo puedo lidiar con la cancelación y mantener el valor del cuadro de texto consistente con el estado de verificación?

Answer 1

Demo

Usar mousedown

$(''#checkbox1'').mousedown(function() {
if (!$(this).is('':checked'')) {
this.checked = confirm("Are you sure?");
$(this).trigger("change");
}
});

Answer 2

Aquí estás

Html

<input id="ProductId_a183060c-1030-4037-ae57-0015be92da0e" type="checkbox" value="true">

JavaScript

<script>
$(document).ready(function () {
$(''input[id^="ProductId_"]'').click(function () {
if ($(this).prop(''checked'')) {
// do what you need here
alert("Checked");
}
else {
// do what you need here
alert("Unchecked");
}
});
});
</script>

Answer 3

Bueno ... solo por ahorrar un dolor de cabeza (aquí es la medianoche pasada), podría llegar a:

$(''#checkbox1'').click(function() {
if (!$(this).is('':checked'')) {
var ans = confirm("Are you sure?");
$(''#textbox1'').val(ans);
}
});

Espero eso ayude

Answer 4

Bueno, no veo una respuesta que coincida con la mía, así que publicaré esto. Probado en JSFiddle y hace lo que está solicitando. Este enfoque tiene el beneficio adicional de disparar cuando se hace clic en una etiqueta asociada con una casilla de verificación.

Respuesta original:

$(document).ready(function() {
//set initial state.
$(''#textbox1'').val($(this).is('':checked''));
$(''#checkbox1'').change(function() {
if($(this).is(":checked")) {
var returnVal = confirm("Are you sure?");
$(this).attr("checked", returnVal);
}
$(''#textbox1'').val($(this).is('':checked''));
});
});

Respuesta actualizada:

$(document).ready(function() {
//set initial state.
$(''#textbox1'').val(this.checked);
$(''#checkbox1'').change(function() {
if(this.checked) {
var returnVal = confirm("Are you sure?");
$(this).prop("checked", returnVal);
}
$(''#textbox1'').val(this.checked);
});
});

Answer 5

Deshazte del evento de cambio y, en cambio, cambia el valor del cuadro de texto en el evento de clic. En lugar de devolver el resultado de la confirmación, cójalo en una var. Si es verdadero, cambia el valor. Luego regresa la var.

Answer 6

Hacer clic en la casilla de verificación y comprobar el valor en el mismo bucle de eventos es el problema.

Prueba esto:

$(''#checkbox1'').click(function() {
var self = this;
setTimeout(function() {
if (!self.checked) {
var ans = confirm("Are you sure?");
self.checked = ans;
$(''#textbox1'').val(ans.toString());
}
}, 0);
});

Demostración: http://jsfiddle.net/mrchief/JsUWv/6/

Answer 7

La mayoría de las respuestas no lo <label for="cbId">cb name</label> (probablemente) si utiliza <label for="cbId">cb name</label> . Esto significa que cuando haga clic en la etiqueta, marcará la casilla en lugar de hacer clic directamente en la casilla de verificación. (No es exactamente la pregunta, pero varios resultados de búsqueda tienden a aparecer aquí)

<div id="OuterDivOrBody">
<input type="checkbox" id="checkbox1" />
<label for="checkbox1">Checkbox label</label>
<br />
<br />
The confirm result:
<input type="text" id="textbox1" />
</div>

En cuyo caso podrías usar:

Earlier versions of jQuery:

$(''#OuterDivOrBody'').delegate(''#checkbox1'', ''change'', function () {
// From the other examples
if (!this.checked) {
var sure = confirm("Are you sure?");
this.checked = !sure;
$(''#textbox1'').val(sure.toString());
}
});

Ejemplo de JSFiddle con jQuery 1.6.4

jQuery 1.7+

$(''#checkbox1'').on(''change'', function() {
// From the other examples
if (!this.checked) {
var sure = confirm("Are you sure?");
this.checked = !sure;
$(''#textbox1'').val(sure.toString());
}
});

Ejemplo de JSFiddle con el último jQuery 2.x

• Se agregaron ejemplos de jsfiddle y el html con la etiqueta de la casilla de verificación que se puede hacer clic.

Answer 8

No estoy seguro de por qué todo el mundo está haciendo esto tan complicado. Esto es todo lo que hice.

if(!$(this).is(":checked")){ console.log("on"); }

Answer 9

Para mí esto funciona muy bien:

$(''#checkboxID'').click(function () {
if ($(this).attr(''checked'')) {
alert(''is checked'');
} else {
alert(''is not checked'');
}
})

Answer 10

Prueba esto

$(''#checkbox1'').click(function() {
if (!this.checked) {
var sure = confirm("Are you sure?");
this.checked = sure;
$(''#textbox1'').val(sure.toString());
}
});

Answer 11

Si está utilizando el iCheck Jquery, utilice el siguiente código

 $("#CheckBoxId").on(''ifChanged'', function () {
alert($(this).val());
});

Answer 12

obtener valor de radio por nombre

 $(''input'').on(''className'', function(event){
console.log($(this).attr(''name''));
if($(this).attr(''name'') == "worker")
{
resetAll();
}
});

Answer 13

simplemente use el evento click, mi casilla de verificación id es CheckAll

 $(''#CheckAll'').click(function () {
if ($(''#CheckAll'').is('':checked'') == true) {
alert(";)");
}
}

Answer 14

$(''#checkbox1'').click(function() {
if($(this).is(":checked")) {
var returnVal = confirm("Are you sure?");
$(this).attr("checked", returnVal);
}
$(''#textbox1'').val($(this).is('':checked''));
});
<div id="check">
<input type="checkbox" id="checkbox1" />
<input type="text" id="textbox1" />
</div>

Answer 15

$(document).ready(function() {
//set initial state.
$(''#textbox1'').val($(this).is('':checked''));
$(''#checkbox1'').change(function() {
$(''#textbox1'').val($(this).is('':checked''));
});
$(''#checkbox1'').click(function() {
if (!$(this).is('':checked'')) {
if(!confirm("Are you sure?"))
{
$("#checkbox1").prop("checked", true);
$(''#textbox1'').val($(this).is('':checked''));
}
}
});
});

Answer 16

// this works on all browsers.
$(document).ready(function() {
//set initial state.
$(''#textbox1'').val($(this).is('':checked''));
$(''#checkbox1'').change(function(e) {
this.checked = $(this).is(":checked") && !!confirm("Are you sure?");
$(''#textbox1'').val(this.checked);
return true;
});
});