无法使用 getElementsByName() 在 IE 中切换表格行的显示
我想根据选择框的值显示和隐藏表格的行，这在 Firefox 中有效，但在 IE 中无效：
<select onChange="javascript: toggle(this.value);">
<option value="cat0">category 0</option>
<option value="cat1">category 1</option>
</select>
<table>
<tr name="cat0">
<td>some stuff v</td>
<td>some stuff v</td>
</tr>
<tr name="cat0">
<td>some stuff d</td>
<td>some stuff d</td>
</tr>
<tr name="cat1">
<td>some stuff a</td>
<td>some stuff a</td>
</tr>
<tr name="cat1">
<td>some stuff b</td>
<td>some stuff b</td>
</tr>
</table>
<script type="text/javascript">
function toggle(category)
{
// turn everything off
for (var i = 0; i < 2; i++)
{
var cat = document.getElementsByName('cat' + i);
for (var j = 0; j < cat.length; j++)
cat[j].style.display = 'none';
}
// turn on category chosen
var cat = document.getElementsByName(category);
for (var i = 0; i < cat.length; i++)
cat[i].style.display = '';
}
// start by showing cat0
toggle('cat0');
</script>
I want to show and hide rows of a table based on the value of a select box and this works in Firefox but not IE:
<select onChange="javascript: toggle(this.value);">
<option value="cat0">category 0</option>
<option value="cat1">category 1</option>
</select>
<table>
<tr name="cat0">
<td>some stuff v</td>
<td>some stuff v</td>
</tr>
<tr name="cat0">
<td>some stuff d</td>
<td>some stuff d</td>
</tr>
<tr name="cat1">
<td>some stuff a</td>
<td>some stuff a</td>
</tr>
<tr name="cat1">
<td>some stuff b</td>
<td>some stuff b</td>
</tr>
</table>
<script type="text/javascript">
function toggle(category)
{
// turn everything off
for (var i = 0; i < 2; i++)
{
var cat = document.getElementsByName('cat' + i);
for (var j = 0; j < cat.length; j++)
cat[j].style.display = 'none';
}
// turn on category chosen
var cat = document.getElementsByName(category);
for (var i = 0; i < cat.length; i++)
cat[i].style.display = '';
}
// start by showing cat0
toggle('cat0');
</script>
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（3）
IE 不允许您使用
document.getElementsByName方法访问表行。如果你使用 ID 而不是名字，它就会起作用。请参阅此页面，了解符合您需求的代码： http:// /www.toolazy.me.uk/template.php?content=getelementsbyname.xmlIE doesn't let you access table rows using the
document.getElementsByNamemethod. If you use ID's instead of name's it will work. See this page for code that does just what you are looking for: http://www.toolazy.me.uk/template.php?content=getelementsbyname.xml对于第二个 for 循环中的表行，您需要将显示属性设置为
table-rowWith table rows in your second for loop you need to set the display property to
table-row实际上有一个 IE bug 你可以利用！只需为每个元素设置名称和 ID（两者必须具有相同的值！）。
例如：
现在
getElementsByName也可以在 IE 中使用。附注我知道这是一个老问题，但我五分钟前就试图解决这个问题。所以它可能对某人有帮助：p
There is actualy an IE bug You can use! Simply set for each element both name and id (both must have same value!).
For example:
<tr name="cat0" id="cat0">Now
getElementsByNamewill work in IE too.ps. I know this is old question, but i was trying to solve this problem 5min ago. So it might help someone :p