ランタイムエラーとは？

0   名前： なお ： 2007/03/08（木） 17:18  ID:Fzbll9kC sub-xO
こんにちは。javascriptを利用したところ、ランタイムエラーというのが消えないので、
間違っている部分があればご教授ください。

やりたい動作としてはリンクにカーソルを合わせるとポップアップで説明を出すというものです。

エラー内容は
ライン:31
文字:3
エラー:'ID.style'はNullまたはオブジェクトではありません。
でした。

ソースは簡略化しましたが下記になります。

また、簡略化したので行数が変わってしまいました。
エラーの言うライン:31とは
// ヘルプの非表示
function hidePop() {
  ID.style.visibility = "hidden";
}
↑の部分の「ID.style.visibility = "hidden";」になるようです。

他サイトさまのサンプルをコピーして文字を変えましたので、エラー内容もよく意味がわかりません…。
よろしくお願い致します。
<html>
<head>
<title>ようこそ！</title>
<SCRIPT language="JavaScript">
<!--
// ポップアップヘルプ
txt = new Array();
txt[1] = '●●';
txt[2] = '○○';
txt[3] = '△△';
txt[4] = '■■';

// ヘルプの表示
function popUp(i) {
  ID.innerHTML = txt[i];
  // ヘルプの位置を調整
  ID.style.left = event.clientX + 10 + 'px'; // 表示するx座標（適度に調整してください）
  ID.style.top = event.clientY - 5 + 'px'; // 表示するy座標（適度に調整してください）
  ID.style.visibility = "visible";
}

// ヘルプの非表示
function hidePop() {
  ID.style.visibility = "hidden";
}

var ID;
onload = function() { ID = document.getElementById('ID'); }

//-->
</SCRIPT>
</HEAD>
<BODY>
<SPAN id="ID" STYLE="visibility: hidden; position: absolute;"></SPAN>
<TABLE><TR><TD colspan="2" onmouseover="hidePop()">〜〜</TD></TR>
<TR><TD>
<a href="top.htm" onMouseOver="popUp(1)"><img src="./image/top.gif" border="0"></A><BR>
<a href="top.htm" onMouseOver="popUp(2)"><img src="./image/top.gif" border="0"></A><BR>
<a href="top.htm" onMouseOver="popUp(3)"><img src="./image/top.gif" border="0"></A><BR>
<a href="top.htm" onMouseOver="popUp(4)"><img src="./image/top.gif" border="0"></A><BR>
</TD><TD onmouseover="hidePop()">〜〜</TD></TR>
<TR><TD colspan="2" onmouseover="hidePop()">〜〜</TD></TR></TABLE>
</BODY></HTML>
1   名前： JAB ： 2007/03/08（木） 17:18  ID:pUIKbVPy sub-gm
そのまんま、'ID.style'がNullまたはオブジェクトじゃないって事でしょ?
簡単に言えばそこらの形式が間違ってるってこと。
var ID;
onload = function() { ID = document.getElementById('ID'); }
辺りでIDの取得が上手くいってないのでは?
2   名前： ABDS ： 2007/03/08（木） 17:18  ID:EnWNHqjc sub-E8
ソースをそのままコピーした所、特にエラーは起きず、●●等も表示・非表示も切り替わりました。
確認：IE6.0 Sleipnir2.5.10
3   名前： 匿名 ： 2007/03/08（木） 17:18  ID:Z/T9lFdK sub-kJ
>>0
その無意味に IE 専用、かつ無意味に body 要素を汚すスクリプトはお勧めできない。別のを探した方が良い。

# どうせ IE 専用なら、getElementById なぞ使わずに直接 id 参照した方が、いっそ清々しい（し速い）。
4   名前： 匿名 ： 2007/03/08（木） 17:18  ID:Z/T9lFdK sub-kJ
>>3 だけでは何なので一応。

とりあえず、>>2 の言うように、IE5+ なら >>0 で動作はするはず。真のエラーは質問者が削った場所で発生している（たぶん、どこかでグローバル変数を上書きしている）。


なお、>>0 を使い続けるならば、以下の点を修正のこと。

・冒頭に <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> を追加（必須）。
・<head> の下に <meta http-equiv="Content-Script-Type" content="text/javascript"> を追加（必須）。
・<script type="text/javascript"> に修正（必須）。
・popUp 関数を次のように修正（IE 以外でも動かすなら必須）。
function popUp (i, event) {
    if (! event) event = window.event;
    // 以下同じ。なお、event.clientX/Y は、Opera はツールバー・サイドバー領域まで含めた値を
    // 返し、Safari はスクロール量まで含めた値を返すことに注意。要するに、かなりズレる。

・上記の修正を加えたならば、onmouseover 属性を次のように修正。
onmouseover="popUp(1, event)"

・<body> 直後の span 要素を削除し、onload 関数を次のように修正（任意）。
onload = function () {
    ID = document.createElement ('span');
    ID.style.visibility = 'hidden';
    ID.style.position = 'absolute';
    document.body.insertBefore (ID, document.body.firstChild);
};

・img 要素に alt 属性を追加（必須）。
5   名前： なお ： 2007/03/08（木） 17:18  ID:Fzbll9kC sub-xO
レスありがとうございます。

＞JABさま
せっかくレスを頂いたのですが、「'ID.style'がオブジェクトではない」という意味が分かりませんでした…。
IDの取得もよく分かりません、すみません。

＞ABDSさま
試していただいてありがとうございます。
私はIE6.0を使用しているのですが、エラーが出ない時もあります。
しかし、時々急にエラーになるので気になっているのです。
エラーになる条件や法則はよく分からないのですが…。

＞匿名さま
BODY要素を汚すという意味がよく分かりかねますが、あまりよくないプログラムだったのですね。
削った部分にコピーしてきたプログラム内容は入っていなかったと思いますが、
私のHTMLもマズい部分があったのかもしれません…。
いいプログラムとよくないプログラムの区別もよく分かりませんので、頂いた修正部分を元に修正してみます。
ありがとうございました。
6   名前： 匿名 ： 2007/03/08（木） 17:18  ID:Z/T9lFdK sub-kJ
>>4
訂正：

> popUp 関数を次のように修正

の if 文は不要だ。event が引数として渡りさえすれば良い。ごめん。


# 組み込みイベント内は無名関数になっており、Gecko、Opera、Safari では event という名前の引数が渡されている（onclick="alert(arguments.callee);" としてみれば分かる）。だから、onmouseover="alert(event);" とすれば、これら 3 つのブラウザではハンドラ引数としての event オブジェクトを参照する。また、IE は window.event を参照する。
一覧へ戻る