IE

IE"インターネットサイトxxxを開けません。"のバグ  [javascript]  [bug_or_spec]  [IE]

またでたよ。IE。
jasonpとかでスクリプトを読み込んで実行するときに、最初のkicker(loader?)的なスクリプトを書く場所によってエラーが発生する。
「インターネットサイトxxxを開けません。操作は中断されました」というエラーウィンドウがでて、サイトは表示されない状態となる。

例:
kicker.js


function kicker(){
  var script = document.createElement("script");
  script.setAttribute("type","text/javascript");
  script.setAttribute("src","./callee.js");
  document.body.appendChild(script);
  return true;
}

scriptタグを作ってcallee.jsを読み込むだけ。
callee.js


function callee(){
  document.getElementById("hogefuga").appendChild(document.createTextNode("hogefuga"));
  return true;
} 
callee();

テキストノードを埋め込むだけ。最後に自分を呼んでいる。
buggy.html(動かないケース)


<html>
  <head>
    <script type="text/javascript" src="./kicker.js" charset="utf-8" ></script>
  </head>
  <body>
    <div>
      <div id="hogefuga"></div><!-- ここにテキストノードが書き加わる -->
      <script>
      <!--
        kicker();
      //-->
      </script>
    </div>
  </body>
</html>

問題は、scriptタグがdivに囲まれていることらしい。
下記のように変更すると動く


:
<div>
  <div id="hogefuga"></div>
</div>
<script>
<!--
  kicker();
//-->
</script>
:

でも、いつもいつも外側に書けるわけでもないよね？
そういう時はeventListenerだそうだ。


if(window.addEventListener){
  window.addEventListener("load",kicker, false);
}else{
  window.attachEvent("onload",kicker);
}

もう、いい加減面倒くさいよ。

参考: http://yusuke.homeip.net/diary/2006/03/12/1142155862799.html

ちなみに、何を作っていて気付いたかというと、このブログの「コメント」欄。
といっても、「はてなブックマーク」をコメント欄代わりに表示しているだけ。

Posted at 2009-04-10 |

IE javascriptではRadioのchecked属性はドキュメントにappend後じゃないと変更できない  [javascript]  [bug_or_spec]  [IE]

またしてもIE。

ラジオボタンを動的に生成する場合、デフォルトとか以前の結果とかをチェックした状態で表示するために


var myRadio = document.createElement('input'); 
myRadio.type = 'radio';
myRadio.value = 'hoge';
myRadio.checked = true;

とかやるじゃないですか。
IEの場合、これではチェックが付かない。
ドキュメントにappendした後に変更する必要があるんだって。
いい加減にしてくれよIE

Posted at 2009-03-16 |

IE javascriptではformのname属性を変更できない  [javascript]  [bug_or_spec]  [IE]

javascriptでformをname属性でアクセスする手法は良く使う。


var abc = document.formname.hoge.value;

これを、動的に生成させたformで行おうと思った場合、IEで問題が起こる。


var myNode = document.getElementById('fuga');
var myForm = document.createElement('form');
myForm.name = 'formname';
var myInput = document.createElement('input'); 
myInput.name = 'hoge'; 
myInput.type = 'text';
myInput.size = "40";
myForm.appendChild(myInput);
myNode.appendChild(myForm);

dom生成時に.nameでname属性を変更しているにもかかわらず、IEでは独自のIDがつけられてしまい、上記のname属性を利用したアクセス方法ではアクセスできないのだ！
有り得ないよ。
そこで、こんなユーティリティ関数が必要になる。


function createNamedElement(tag,name){
  var isIE =/*@cc_on!@*/false;
  var element;
  if (name) {
    element = (isIE)? document.createElement('<' + tag + ' name="' + name + '">'): document.createElement(tag);
    element.name = name;
  } else {
    element = document.createElement(tag);
  } 
  return element;
}

IE恐るべし。

ちなみに’cc_on’の所は、IEの判定で良く使われる方法(らしい)。

この記事のタグ名’bug_or_spec’のネーミングセンスの良さに自画自賛

Posted at 2009-03-13 |

IE DOM table tips  [javascript]  [bug_or_spec]  [IE]

  • DOM作成時にtbody書かないとIEはtableを表示しない
  • colspan は colSpanとして設定する必要がある
Posted at 2008-06-02 |