[JavaScript] IE8でのTextRange.moveToPoint()

どうも、お久しぶりです。元気に死んでいます。

今日はIE8でJavaScriptのTextRangeでハマったので備忘録にちょっと書きます。

よくやるコードがこんな感じ。


var target = document.getElementById('hoge'); // textarea
var selection = document.selection.createRange();
var range = target.createTextRange();

range.moveToPoint(selection.offsetLeft, selection.offsetTop);
range.moveEnd('textedit');

// あとの処理は今回重要じゃないので端折ります。

まぁこれをIE8で動かすと range.moveToPoint()でエラーが起きます。
IE8「未定義だよ!未定義だよ!」

ちなみにこの未定義のエラーが起きるパターンは私が調べた限りでは
行頭か行末にカーソルがある場合。(つまりテキストがない場合もエラーが起きます。)

なかでなんの処理をやったからそうなるのかはわからないですが、
IE8がエラーと言うのだからエラーなのです。

実はこのエラーはIE8の互換表示モードで動かすとIE7とかのように期待通りに動作します。
このエラーを回避するために2時間ぐらい色々やってたどり着いた答えは。

HTMLのhead部分に下記のメタタグを付け足すだけ。


<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" />
これでIE8は強制的に互換表示モードになり、エラーが回避できると言うやっつけ仕事です。

同じようにmoveToPoint()の未定義エラーに悩まされた人の助けになれば幸いです。