web-dev-qa-db-ja.com

ページをリロードするときにチェックボックスがチェックされたままになるのはなぜですか？

次のコードを含むWebページをリロードしています。

<label for="showimage">Show Image</label>
<input id="showimage" name="showimage" type="checkbox" value="1" />

HTMLがブラウザに送信されたままであっても、ページをリロードするたびに同じになりますが、チェックボックスはリロードが実行されたときに常にチェックされた値を取ります。つまり、ユーザーがチェックボックスをチェックしてリロードする場合、チェックボックスはチェックされたままです。

ここでいくつかのキャッシュが行われていますか？

編集：Gordon Bellのソリューションを以下で試してみましたが、value = "1"を削除した後でもこれが発生していることがわかりました。他に何か足りないものはありますか？

<label for="showimage">Show Image</label> 
<input id="showimage" name="showimage" type="checkbox" />
firefox
74
Readonly

はい、キャッシュしていると思います。たとえば、Firefoxでこの動作が見られます（Safariではなく、価値のあるものです:)）。

を使用してページをリロードし、キャッシュをバイパスできます（Firefoxの場合） CTRL-SHIFT-R そして、あなたはチェック値が運ばないことがわかります（通常 CTRL-R ただし、キャッシュから情報を取得します）

編集：Firefoxでこのサーバー側を無効にして、キャッシュ制御ヘッダーを設定できました。

Cache-Control: no-store

これはFirefoxの「フォーム値を記憶する」機能を無効にしているようです

35
Owen

autocomplete="off"をページのフォーム要素に追加します。欠点は、これが有効なXHTMLではないことですが、複雑なJavaScriptを使用せずに問題を修正します。

141
ironbirdman

jsでのautocomplete = "off"の設定もうまく機能しています。

たとえば、jqueryを使用します。

$(":checkbox").attr("autocomplete", "off");
29
RainChen

これはFirefoxの素晴らしい機能です。何かを入力してもページをリロードすると、テキストはテキスト領域に残ります。選択した他の設定については同じです。

残念ながら、それはSO（おそらくJSによってリセットされます）およびIEのような鈍いブラウザでは機能しません...

これは解決策を提案します。本当にそれが必要な場合は、JSでフォームをリセットします。 form.reset（）は仕事をするかもしれません（Reset inputボタンのように振る舞います）。

1
PhiLho

$（ "＃showimage"）。prop（ "checked"、false）;

0
Sumit Mehta

これは古い質問ですが、Firefoxにとっては依然として活発な問題です。私が試みた応答はどれもそれを解決しませんでしたが、did私にとってそれを解決するのは単にこれでした：

    document.getElementById('formId').reset();

これにより、ページがロードされるたびにフォームがデフォルトのオプションにリセットされます。きめ細かな制御を失うため理想的ではありませんが、これは私にとってこれを解決した唯一のものです。

0
cmshnrblu

ブラウザのキャッシュが原因である可能性があります-あまり頻繁に変更されない静的なWebサイトには非常に便利で、動的なWebアプリケーションには非常に悪いです。
ページのヘッドセクションでこれらの2つのメタタグを試してください。 2番目のメタタグは、「no-cache」メタタグを認識しない古いブラウザー（IE5）用であり、異なるものは同じ結果を生成します。各要求はサーバーに送信されます。

<META HTTP-EQUIV="Pragma" CONTENT="no-cache"> 
<META HTTP-EQUIV="Expires" CONTENT="-1">
0
Aleksandar

それを解決するためのパブリックアイデア

フォームリセットボタンを作成する

<form>
<checkbox>
<reset>
</form>

$(reset).trigger("click");//to clear the cache and input 
$(checkbox).trigger("click");//to mark checkbox
0
Mohamed Gomah

または、f5の代わりにアドレスバーでEnterを押してください:)

0
Ionuț Staicu