valerian polizzi
Estoy trabajando en un filtro basado en casillas de verificación para un comercio electrónico. Todo funciona bien, pero cuando intento volver a través del botón Atrás, las casillas de verificación siguen verificado sin ningún atributo verificado.
Noté que este “problema” está ocurriendo en:
- Safari
- Cromo
La única forma que encontré es recargar la página. Pero el evento “usuario-regresó” no parece ser detectable, y no quiero actualizar cada página.
Establecer todas mis casillas de verificación por defecto no tiene sentido.
Deshabilitar el caché de Chrome no tiene ningún efecto.
No sé si las muestras de mi código serían útiles.
EDITAR: es mi primera publicación, así que asegúrese de decirme por qué mi pregunta parece poco clara
Hay un truco loco para solucionar este problema. Agregar autocomplete="off" a sus casillas de verificación. ¡Suena loco pero funciona!
-
Esto no parece una buena solución, incluso si funciona. Suena casi como si te estuvieras aprovechando de un error. ¿Qué pasa si el “error” se corrige en futuros navegadores? Las respuestas locas necesitan una explicación, y una respuesta racional gana a una respuesta loca todos los días.
– osullic
12 de marzo de 2021 a las 23:53
-
Me parece que el OP está leyendo el atributo marcado del elemento de entrada, cuando debería estar leyendo su propiedad marcada. el comprobado atributo solo especifica cómo debe ser la casilla de verificación inicializado, pero los navegadores recuerdan el estado del formulario cuando navega hacia adelante o hacia atrás. el comprobado propiedad debe coincidir con la forma en que el navegador muestra actualmente la casilla de verificación.
– osullic
12 de marzo de 2021 a las 23:56
-
“A diferencia de otros navegadores, Firefox conserva de forma predeterminada el estado dinámico marcado de una
a lo largo de las cargas de página. Utilice el atributo de autocompletar para controlar esta función”. desarrollador.mozilla.org/en-US/docs/Web/HTML/Element/input/… – BeeZee
26 de marzo de 2021 a las 13:55
usuario3649978
Sé que esta es una pregunta antigua, pero alguien podría “Googlear” la misma pregunta y aterrizar aquí, tal como lo hice yo. En 2019, Chrome 71 todavía tiene este comportamiento, por lo que es algo que no desaparecerá pronto. Mientras tanto, aquí hay un script para ajustar fácilmente el estado marcado al atributo marcado.
<script>
/* This script is to FIX some strange browser (Chrome included) behaviour.
History back returns false checks on checkboxes.
The checked HTML attribute is only a "DEFAULT VALUE" unfortunately */
var filter_form = document.getElementById("filter_form");
var inputs = filter_form.getElementsByTagName("input");
for(var i = 0; i < inputs.length; i++) {
if(inputs[i].type == "checkbox") {
/* If default is checked, but state is not checked, check it*/
if (inputs[i].defaultChecked == true) {
if (inputs[i].checked != true) {
inputs[i].checked = true;
}
/* If defeault not checked, but state is checked, uncheck it */
} else {
if (inputs[i].checked == true) {
inputs[i].checked = false;
}
}
}
}
</script>
Use Javascript para limpiar el formulario, probablemente más rápido usando un marco como jQuery. Entonces algo como esto…
$( document ).ready(function() {
$(':input').val(''); //This would clear all inputs.
});
Entonces, cuando el documento termine de cargarse, borrará todas las entradas.
-
El hecho es que mis casillas de verificación actúan como filtros en esta situación. Borrar todas las casillas de verificación después de cargar la página no tiene sentido porque recuperaría qué casilla de verificación se debe marcar a través de $_REQUEST
– Valerian Polizzi
16 de noviembre de 2015 a las 8:58
-
¿Usar JS para obtener parámetros http y aplicar/borrar la casilla de verificación según corresponda, entonces? Lo siento, creo que no entendí bien tu primera pregunta.
– Matt el Ninja
16 de noviembre de 2015 a las 9:12
También tuve este problema, pero quería mantener el estado marcado (y simplemente ajustar el estado de la página). Tuve el problema de que Chrome simplemente cambió el estado marcado de la casilla de verificación después de ejecutar JavaScript, incluido el evento de carga, sin activar más eventos (como cambio o entrada).
¿Algún evento? ¡No! Como se señaló otra pregunta sobre Firefox que mantiene la página en caché sin ejecutar JS al hacer clic en el botón Atrás, hay un evento que se activará después de que todo esté configurado y se ejecute cualquier otro javascript: presentación de página en la ventana.
window.onpageshow = () => {
updateContent();
};
Esto no solo se ejecutará en Firefox incluso después de que se recupere el historial, sino también después de que Chrome marque la casilla de verificación después de que se recupere el historial, y la propiedad marcada en la casilla de verificación estará en el estado correcto.
Suyog
Use la siguiente función en la carga del cuerpo.
<body onLoad="uncheck()">
<script>
function uncheck() {
$(':checkbox:checked').prop('checked',false);
//or you can also use removeAttr
//$(':checkbox:checked').removeAttr('checked');
}
</script>
Controlar apuntalar y removeAttr para más detalles
O también puede usar el siguiente código
<script>
$( document ).ready(function() {
$(':checkbox:checked').prop('checked',false);
//$(':checkbox:checked').removeAttr('checked');
});
</script>
Controlar .Listo para más detalles.
O
En caso de que desee borrar todos los campos de entrada, aquí está la respuesta con una explicación detallada: restablecer un formulario de varias etapas con jQuery
Cuidado si usas el
readyevento (como sugieren Matt The Ninja y Suyog). No se activará en la parte posterior, a menos que especifique unonunloadmanipulador. consulte stackoverflow.com/questions/158319/… Solowindow.onunload = function(){};es suficiente– rey_nak
16 de noviembre de 2015 a las 8:58
Eso suena muy bien. Efectivamente, el problema está resuelto. Gracias @king_nak
– Valerian Polizzi
16 de noviembre de 2015 a las 9:28