我有以下方式的Java脚本中的代码。
function changeRoomType()
{
var rtype = document.getElementById('typeofroom').value;
var ps = document.getElementsByName('radios');
if(rtype == 'sb' || rtype == 'db')
{
ps[0].style.display = 'block';
ps[1].style.display = 'block';
}
else
{
ps[0].style.display = 'none';
ps[1].style.display = 'none';
}
}
我的html代码是
<p style="position: absolute; float: left; bottom: 138px; width: 50px; left: 359px;display:none;"
name='radios'>
<label for="class">Superior</label>
<input type="radio" name="radio" id="class" value="s" tabindex="1" style="float:left; width:25px;background-color:transparent !important;"/>
</p>
<p style="position: absolute; float: left; bottom: 138px; width: 50px; left: 287px;display:none;"
name='radios'>
<label for="class2">Premier</label>
<input type="radio" name="radio" id="class2" value="p" tabindex="1" style="float:left; width:25px;background-color:transparent !important;"/>
</p>
当在写入onchange事件的选择框中选择该值时,将调用上述函数。通过在选择框中选择房间类型,将显示两个单选按钮。在谷歌浏览器和mozilla中,这工作正常。但是在Internet Explorer8中,IAM出现错误
0.style为null或不是对象。
而不显示单选按钮。
提前致谢!
最佳答案
相关的问题和解决方案已发布在here上。
请参考MSDN documentation on getElementsByTagName。 MSDN上的该文档讨论了getElementsByName的行为受expando属性的影响。
通过控制expando属性,可以定义IE如何处理不属于HTML元素的标准属性集的属性。请参阅Expando on MSDN
Documentation for the p tag建议名称属性不属于该标签的标准属性;因此,它是扩展属性。因此,尽管Mozilla和Chrome对这种扩展的属性和工作感到满意;除非在Javascript中设置document.expando=true
,否则IE不会识别此属性。请注意,这需要有条件地通过检查浏览器名称来完成。
事后思考-为什么不使用jQuery执行此类DOM操作?您将免于编写跨浏览器兼容的javascript代码的偏头痛,并且将专注于您的网站功能。