IE_Form の特殊効果で更新後のチェックボックスの初期化に関する問題

一見したところ、この関数は非常に単純なチェックボックスであり、スクリプトを追加し、このチェックボックスの selected 属性を false に設定します。

コードをコピー コードは次のとおりです:

<script>document.getElementById("chk_UnInital").checked=false;<br> </div> <br>このコードが使用されますFirefox などでは、この要件は IE では実現できません。更新するか戻るかにかかわらず、チェックが常にチェックされます。 <br>このコードは IE では動作しないのでしょうか? <br> 確認するには、このスクリプトの前後にアラートを追加し、checked=false を実行する前後でチェックボックスがオフになっていることを確認します。警告ボックスが確認されると、代わりにチェックボックスが表示されます。 <br>これは、後続のページ読み込みシーケンスで、イベントによってこのチェックボックスが再度 true に設定されることを意味します。まず、ページの onload <br><div class="codetitle"><span><a style="CURSOR: pointer" data="23952" class="copybut" id="copybut23952" onclick="doCopy('code23952')"><u>コードをコピーして実行してください。 🎜></u></a> コードは次のとおりです:</span></div> <div class="codebody" id="code23952"><script> <br>window.onload=function(){ <br>alert("before"); > document.getElementById("chk_UnInital").checked=false; <br>} <br></script>


予想どおり、alert("before"); を実行するとこれが見つかりました。チェック マークが選択されているということは、onload イベントの前にブラウザによってチェック マークが自動的に選択されたことを意味します。具体的な理由には、IE の内部メカニズムが関係しています。

この関数を onload イベントに登録すると、この要件が満たされます。
ただし、ローカル テスト中に、ページのすべての要素がロードされるまで onload は実行されません。これにより、onload イベントが遅延することになります。
後で、Web サイト上の別のチェックボックスが、ページが更新されたときに前の状態が保存されないことがわかりました。慎重に比較した結果、この入力には追加の selected="" 属性があることがわかりました:

この属性を使用すると、イベントを onload に配置しなくても機能します
その理由は何ですか?
次に、次の実験を実行します。

コードをコピーします コードは次のとおりです:

このチェックボックスは初期化できません ;br>

このチェックボックスは初期値にすることができます/label>
<script> <br>var chks=document.getElementsByTagName("input"); var i=0, l=chks.length;i<l;i ){ <br> アラート(chks[i].id); <br> chks[i].checked=false; //} <br></script>


説明の便宜上、ここでは上記のスクリプトの実行時間を t1、window.onload の実行時間を t3、その間の実行時間を t2 とします。
アラートを追加した後、次のことがわかりました。 that :
Chk_UnInital chk_Inital
スクリプトはスクリプトブロック内で実行されます:
t1 前に選択されます 選択されます
t1 後に選択されます 未選択
onload で以下が実行されます:
t3 より前に選択されます 後
t3を選択すると、未選択になります。Unselected
checked=""を追加すると、t1より前に選択され、t1で未選択に設定されることがわかります。
概要:
オプション 1: onload イベントでの処理
オプション 2: selected 属性を追加します

<title> 新しいドキュメント </title> <meta name="Generator" content="EditPlus"> <meta name="Author" content=""> <meta name="Keywords" content=""> <meta name="Description" content=""> <form id="form1" name="form1"> <input type="checkbox" id="chk_UnInital" name="chk_UnInital"> <label for="chk_UnInital">このチェックボックスを初期値にすることはできません</label> <input type="checkbox" id="chk_Inital" name="chk_Inital" checked> <label for="chk_Inital">このチェックボックスは初期値にすることができます</label> <a href="http://www.baidu.com">このリンクをクリックして次に進み、2 つのチェックボックスのステータスを確認してください</a> </form>
[Ctrl A すべて選択 注: 外部 Js を導入する必要がある場合は、

を実行するために更新する必要があります]<script> //window.onload=function(){ var chks=document.getElementsByTagName("input"); for(var i=0,l=chks.length;i<l;i++){ 　　//alert(chks[i].id); 　　chks[i].checked=false; } //} </script>