5

探している要素にが含まれている場合、$get('foo')または失敗する場合がいくつかあります。これは一部のブラウザでは機能するようですが、他のブラウザでは機能しないようです。具体的には、以下に示すケースは、互換モードを備えたIE9で正常に機能しますが、互換モードをオフにすると失敗します。document.getElementById('foo')style="display:none;"

なぜこれが起こるのか、そしてそれをどのように回避できるのかを誰かが説明できますか？次に例を示します。

ASPXページには

<span id="JobAddressCheckBoxWrapper" style="display: none;">
  <asp:CheckBox ID="JobAddressCheckBox" CssClass="DefaultTextCell" runat="server" Text="__Job address"
    Style="margin-right: 2em;" onclick="ShowJobAddress();" />
</span>
<span id="PredefinedReplyCheckBoxWrapper">
  <asp:CheckBox ID="PredefinedReplyCheckBox" CssClass="DefaultTextCell" runat="server"
    Text="__Pre-defined reply" onclick="ShowReplies()" AutoPostBack="false" Style="margin-right: 2em;" />
</span>

その結果、この生成されたHTMLになります

<span style="display: none;" id="JobAddressCheckBoxWrapper">
  <span style="margin-right: 2em;" class="DefaultTextCell">
    <input id="JobAddressCheckBox" onclick="ShowJobAddress();" name="JobAddressCheckBox" type="checkbox">
    <label for="JobAddressCheckBox">Job address</label>
  </span>
</span>
<span id="PredefinedReplyCheckBoxWrapper">
  <span style="margin-right: 2em;" class="DefaultTextCell">
    <input id="PredefinedReplyCheckBox" onclick="ShowReplies();" name="PredefinedReplyCheckBox" type="checkbox">
    <label for="PredefinedReplyCheckBox">Predefined reply</label>
  </span>
</span>

次のJavascriptステートメントは、オブジェクトを含むラッパー変数になりますが、一部のブラウザー、またはIE9の互換モードでは、jobAddressWrapperの値はnullです。定義済みのReplyWrapperの値がnullになることはありません。それらの唯一の違いは、JobAddressCheckboxWrapperに。があることですstyle="display:none;"。

var jobAddressWrapper = $get('JobAddressCheckboxWrapper');
var predefinedReplyWrapper = $get('PredefinedReplyCheckBoxWrapper');

また

var jobAddressWrapper = document.getElementById('JobAddressCheckboxWrapper');
var jobAddressWrapper = document.getElementById('PredefinedReplyCheckBoxWrapper');

要素がスパンでラップされたHTMLパターンは関係ありません。要素がスパンでラップされていないが、が含まれている場合は参照できない場合もありますstyle="display:none;"。

更新（コメントなどに応じて）：

  1. $ getは、Sys.UI.DomElementクラスのgetElementByIdメソッドへのショートカットを提供します。詳細はこちら
  2. これらの呼び出しは、onloadから、およびユーザーの操作に応じて呼び出される関数で行われます。どちらの場合でも問題が発生します。
4

2 に答える 2