web-dev-qa-db-ja.com

Firefoxのバグ-更新時に無効化された入力属性がリセットされない

Firefoxのバグと思われるものを見つけましたが、これが実際にバグであるかどうかと、このための回避策について疑問に思っています。

次のソースを使用して基本的なWebページを作成する場合：

<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を無効にしないようにリセットします。

もう1つの興味深い情報は、入力がcheckboxではなくtextboxの場合でも同じことを行うということです。

htmlfirefoxinputtextbox
100
Stephen Mesa

これはFirefoxの"feature"であり、ページの更新時にフォーム入力値を記憶します。この動作を修正するには、単にautocomplete="off"入力を含むフォーム上、または直接入力に直接。

これにより、オートコンプリートの機能が停止し、ブラウザーが入力フィールドの状態を記憶できなくなります。

または、CTRL + F5をクリックして「ハードリフレッシュ」することもできます。これにより、現在のページが完全にリセットされます。

123
Stephen Mesa

戻るボタンを扱うには、これを行います（ here から）

    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);
    }
9
Joshua Fox

前に述べたように、ボタンにautocomplete="off"を追加する必要があります。

これは、HTMLファイル/テンプレートの<button>sの場合にこれを自動化するsh + Perlスニペットです（いくつかの仮定の下で）。

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修飾子 は.も改行に一致します）

  • 有効なHTML（たとえば、<と>の間に変な文字はなく、開始タグ内にエスケープされていない（>）はありません。

1
phk