0

重複の可能性：
jQueryまたは `getElementById`などのDOMメソッドが要素を見つけられないのはなぜですか？

これは明らかだと思いますが、2時間のヘッドバンギング。各選択ボックスから値を取得しようとしています。

<table>
<tr><td>Team</td><td>Games</td><td>Players</td></tr>
<tr><td><div id="selTeam">
<select name="teams" id="teams" onChange="sndReq(this)"  >
  <option value="-1">-- Not Set --</option>
</select>
</div></td>
<td><div id="selGames">
<select name="games" id="games" onChange="sndReq(this)" )" >
  <option value="-1">-- Not Set --</option>
</select>
</div></td>
<td><div id="selPlayers">
<select name="players" id="players" onChange="sndReq(this)" )" >
  <option value="-1">-- Not Set --</option>
</select>
</div></td></tr>
</table>

これが私が使用しているJavaScriptで、getElementByIdはnullを返し続けます。

        var selbox = document.getElementById("teams");
        var idx = selbox.selectedIndex;
        var teamValue = selbox.options[idx].value;

        var selbox = document.getElementById("games");
        var idx = selbox.selectedIndex;
        var gameValue = selbox.options[idx].value;

        var selbox = document.getElementById("players");
        var idx = selbox.selectedIndex;
        var playerValue = selbox.options[idx].value;

JQueryを使わないようにしています。

ありがとう！

4

2 に答える 2

1

document.getElementById("teams");以下は、返される可能性のある理由の一部ですnull。

  1. ドキュメントに のオブジェクトはありませんid="teams"。
  2. コンテンツが読み込まれる前に、ドキュメントの読み込みプロセスの早い段階でコードを実行しています。このコードは<body>、関連するコンテンツの最後で実行できます。<head>セクションからこのコードを実行することはできません。
  3. id="teams"が正しく解釈されない原因となる何らかの HTML エラーがあります。
  4. HTML は (他の JavaScript によって) ページに動的に挿入されているため、コードの実行時には存在しません。この場合、検索する前にドキュメントに挿入されるまで待つ必要があります。
  5. HTML はフレーム内にあるため、間違ったドキュメントで探しています。

最も一般的な間違いは、コードの実行が早すぎて、DOM がロードされるのを待ってからコードを実行するか、 の<body>直前にタグの末尾からコードをトリガーする必要があることです</body>。

于 2013-01-20T17:29:27.000 に答える
1

あなたのコードは大丈夫です。これが実際の例です。HTML がレンダリングされた後、必ず JS を実行してください。本体下部に入れるか、中に入れるかwindow.onload。

これはうまくいくはずです：

<table>
<tr><td>Team</td><td>Games</td><td>Players</td></tr>
<tr><td><div id="selTeam">
<select name="teams" id="teams" onChange="sndReq(this)"  >
  <option value="-1">-- Not Set --</option>
</select>
</div></td>
<td><div id="selGames">
<select name="games" id="games" onChange="sndReq(this)" )" >
  <option value="-1">-- Not Set --</option>
</select>
</div></td>
<td><div id="selPlayers">
<select name="players" id="players" onChange="sndReq(this)" )" >
  <option value="-1">-- Not Set --</option>
</select>
</div></td></tr>
</table>
<script type="text/javascript" language="javascript">
        var selbox = document.getElementById("teams");
        var idx = selbox.selectedIndex;
        var teamValue = selbox.options[idx].value;

        var selbox = document.getElementById("games");
        var idx = selbox.selectedIndex;
        var gameValue = selbox.options[idx].value;

        var selbox = document.getElementById("players");
        var idx = selbox.selectedIndex;
        var playerValue = selbox.options[idx].value;
</script>
于 2013-01-20T17:31:45.760 に答える