Ошибка с Firefox - Отключено Атрибут ввода не сбрасывается при обновлении

Я нашел то, что считаю ошибкой с Firefox, и мне интересно, действительно ли это ошибка, а также любые обходные пути для этого.

Если вы создаете базовую веб-страницу со следующим источником:

<html>
  <head>
    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.0/jquery.min.js"></script>
  </head>
  <body>
    <div>
      <input id="txtTest" type="text" />
      <input type="button" onclick="$('#txtTest').attr('disabled','disabled');" value="Set Disabled (jQuery)" />
      <input type="button" onclick="document.getElementById('txtTest').disabled = true;" value="Set Disabled (js)" />
      <input type="button" onclick="$('#txtTest').removeAttr('disabled');" value="Remove Disabled" />
    </div>
  </body>
</html>

Если вы disable textbox динамически, а затем обновите страницу, textbox останется отключенным, а не возвратом в исходное состояние, которое не отключено. Я пробовал это в IE8 и Chrome, и они ведут себя так, как я ожидал, сбросив textbox обратно, чтобы не отключиться при обновлении.

Еще одна интересная информация состоит в том, что она по-прежнему делает то же самое, если на входе есть checkbox вместо textbox.

Ответы

Ответ 1

Это "функция" Firefox, которая запоминает вводимые значения формы для обновления страницы. Чтобы исправить это поведение, вы просто устанавливаете autocomplete="off" в форме, содержащей входные данные, или просто непосредственно на вход.

Это останавливает автозаполнение от работы и предотвращает запоминание браузером состояния полей ввода.

В качестве альтернативы вы можете просто "жестко обновить", нажав CTRL + F5. Это будет полностью reset текущая страница.

Ответ 2

Чтобы справиться с кнопкой "Назад", сделайте это (от здесь)

    window.addEventListener('pageshow', PageShowHandler, false);
    window.addEventListener('unload', UnloadHandler, false);

    function PageShowHandler() {
        window.addEventListener('unload', UnloadHandler, false);
    }

    function UnloadHandler() {
        //enable button here
        window.removeEventListener('unload', UnloadHandler, false);
    }

Ответ 3

Как уже упоминалось ранее, вам нужно добавить autocomplete="off" к вашим кнопкам.

Вот фрагмент sh + perl для автоматизации этого в случае <button> в ваших HTML файлах/шаблонах (при некоторых предположениях):

find /path/to/html/templates -type f -name '*.html' -exec perl -pi -e \
  's/(?<=<button )(.*?)(?=>)/@{[(index($1,"autocomplete=")!=-1?"$1":"$1 autocomplete=\"off\"")]}/g' \
  {} +

Предположения:

  • Открытие тегов <button> начинается и заканчивается на одной строке. Если это не так (то есть они могут быть разделены на несколько строк), то замена /g на /gs должна помочь (s modifier вызывает соответствие . символам новой строки)

  • Допустимый HTML (например, нет смешных символов между < и >) и не будет отображаться больше, чем (>) внутри открытого тега.