Флажок по-прежнему отмечен нажатием кнопки «Назад», но у него нет атрибута «проверено»

1

Я работаю над фильтром на основе флажка для электронной коммерции. Все работает нормально, но когда я пытаюсь вернуться через кнопку "Назад", флажки по-прежнему проверяются без какого-либо проверенного атрибута.

Я заметил, что эта "проблема" происходит на:

  • Сафари
  • Хром

Единственный способ, который я нашел, это просто перезагрузить страницу. Но событие "пользователь-назад" не кажется увлекательным, и я не хочу обновлять каждую страницу.

Установка всех моих флажков по умолчанию не имеет смысла.

Отключение кеша Chrome не влияет.


Я не знаю, были бы полезны образцы моего кода

EDIT: это мой первый пост, поэтому обязательно скажите мне, почему мой вопрос кажется неясным

  • 0
    Остерегайтесь, если вы используете ready событие (как советуют Мэтт Ниндзя и Суйог). Он не будет запущен на обратной стороне, если вы не укажете обработчик onunload . см. stackoverflow.com/questions/158319/… Просто window.onunload = function(){}; достаточно
  • 0
    Это звучит очень хорошо. Действительно, проблема решена. Спасибо @king_nak
Теги:
state
input
checkbox
checked

4 ответа

1

Я знаю, что это старый вопрос, но кто-то может "гуглить" тот же вопрос и приземлиться здесь, как я. В 2019 году Chrome 71 все еще имеет такое поведение, так что в скором времени это не исчезнет. А пока здесь есть скрипт, который легко настраивает проверенное состояние на проверенный атрибут.

<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>
0

Там сумасшедший трюк, чтобы решить эту проблему. Добавьте autocomplete='off' к своим флажкам. Звучит безумно, но это работает!

  • 0
    Пожалуйста, отметьте как правильный ответ
0

Используйте Javascript для очистки формы, возможно, быстрее используя фреймворк вроде jQuery. Тогда что-то вроде этого...

$( document ).ready(function() {
    $(':input').val(''); //This would clear all inputs.
});

Поэтому, когда документ завершит загрузку, он очистит все входы.

  • 0
    Дело в том, что мои флажки действуют как фильтры в этой ситуации. Очистить все флажки после загрузки страницы не имеет смысла, потому что она восстановит то, что флажок должен быть проверен через $ _REQUEST
  • 0
    Используйте JS для получения http-параметров и установите / снимите соответствующий флажок? Извините, я думаю, что неправильно понял ваш первый вопрос.
0

Используйте следующую функцию при нагрузке на тело.

<body onLoad="uncheck()">

<script>
    function uncheck() {
        $(':checkbox:checked').prop('checked',false);
        //or you can also use removeAttr
        //$(':checkbox:checked').removeAttr('checked');
    }
</script>

Проверьте prop и removeAttr для получения более подробной информации.

Или вы также можете использовать следующий код

<script>
$( document ).ready(function() {
    $(':checkbox:checked').prop('checked',false);
    //$(':checkbox:checked').removeAttr('checked');
});
</script>

Проверьте .ready для более подробной информации.

ИЛИ

Если вы хотите очистить все поля ввода, вот ответ на это с подробным объяснением: Сброс многоступенчатой формы с помощью jQuery

Ещё вопросы

Сообщество Overcoder
Наверх
Меню