由ID获取一个选择元素的值

问题描述：

可能重复：头
Why does jQuery or a DOM method such as `getElementById` not find the element?由ID获取一个选择元素的值

我敢肯定，这是显而易见的，但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返回一个空。

 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。

谢谢！

当/你是如何调用'document.getElementById'（这行代码）？代码本身看起来很好，我假设你在元素存在之前调用它。如果是这样，请查看http://*.com/q/14028959/218196。否则，请提供有关此代码上下文的更多信息，最好是http://jsfiddle.net/演示。 –

看起来你在标记中有问题：在'

顺便说一句，你可以通过简单的'document.getElementById（“teams”）.value'得到'

答

这些都是一些原因，document.getElementById("teams");可能返回null：

没有与id="teams"文档中没有对象。
在加载内容之前，您在文档加载过程中过早运行代码。您可以在相关内容之后的<body>末尾运行此代码。您无法从<head>部分运行此代码。
您有某种HTML错误导致id="teams"无法正确解释。
HTML正在被动态地插入到页面中（通过其他一些javascript），所以它在您运行代码时不存在。在这种情况下，在查找文档之前，您必须等到它插入到文档中之后。
HTML是在一个框架，所以你正在寻找它在错误的文件。

最常见的错误是，你是太早运行代码，你必须等待DOM来运行代码之前加载或你必须</body>之前触发来自的<body>标签右边的代码到底。

这将是很好，如果你可以添加到http://*.com/a/14028960/218196 :)（特别是Ajax和iframe部分）的答案的某些方面 –

感谢你！我是动态重新插入代码，我的代码没有包含ID值。令人惊讶的是你能够瞄准，没有更多的信息！ –

@FelixKling - 随意添加任何似乎与您的答案[这里]（http://*.com/a/14028960/218196）相关的项目。 – jfriend00

答

你是代码很好。这是working example。确保在呈现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>

由ID获取一个选择元素的值

相关推荐