gpt4 book ai didi

css - 使用 javascript 将 div 的样式设置为 "none"或 "block"在 IE9 中不起作用,但在 Chrome 中有效

转载 作者:行者123 更新时间:2023-11-28 12:19:18 25 4
gpt4 key购买 nike

我有一个要放在网页上的表单,我的大多数用户将使用 IE。顶部有一系列单选按钮,当选择其中任何一个时,下面的表格应该会发生变化。这是代码:

<html>
<head>
<script language="javascript">
function prepareForm() {
var t = document.getElementById('top');
document.getElementById('search1').style.top = t.style.top + t.style.height;
document.getElementById('search2').style.top = t.style.top + t.style.height;
document.getElementById('search3').style.top = t.style.top + t.style.height;
}
function displayForm() {
var a = document.getElementsByName('search');
var b = document.getElementsByName('searchBy');
for (i=0;i<a.length;i++) {
if (!b[i].checked) {
a[i].style.display="none";
} else {
a[i].style.display="block";
}
}
}
</script>
</head>
<body style="font-family:calibri;text-align:center;" onLoad="displayForm();">
<div id="top">
<center><h3>My webpage</h3></center>
<br>
<form method="post" action="results.html" name='myForm'>
<center><font face='calibri'>Search By:</center><br>
<center>
<input type="radio" name="searchBy" value="search1" checked onClick="displayForm();">Form one
<input type="radio" name="searchBy" value="search2" onClick="displayForm();">Form two
<input type="radio" name="searchBy" value="search3" onClick="displayForm();">Form three
</div>

<!-- search area 1 -->
<div name="search" id="search1" style="margin-left:auto;margin-right:auto;display:block;">
<p>Form 1</p>
<input type="Submit" value="Submit">
</div>

<!-- search area 2-->
<div name="search" id="search2" style="margin-left:auto;margin-right:auto;display:none;">
<p>Form 2</p>
<input type="Submit" value="Submit"></b>
</div>

<!-- search area 3 -->
<div name="search" id="geoSearch" style="margin-left:auto;margin-right:auto;display:none;">
<p>Form 3</p>
</div>

</body>
</html>

此代码似乎在 Chrome 中有效,但在 IE9 中,当调用 javascript 函数 displayForm() 时,显示不会改变。 div 的 style.display 属性在 IE9 和 Chrome 之间有什么不同吗?

最佳答案

如果您确实需要帮助,请先搜索原因 IE bugs with document.getElementByID

发件人:http://msdn.microsoft.com/en-us/library/ie/ms536437%28v=vs.85%29.aspx :

this method performs a case-insensitive match on both the ID and NAME attributes, which might produce unexpected results.

阅读了一些相关内容后,通过 <!doctype> 进行验证,请尝试替换您的“姓名”和“ID”,以便它们匹配,然后对其进行测试,然后返回此处提供详细信息和更多信息,以便我们可以进一步帮助您。

PostScriptum:当我读到这篇文章时:“我不知道 HTML 4 中语言属性已经过时”,感觉就像该死的!我是不是在浪费时间去帮助一个永远不会在 Web UI 开发职业中成长、没有全心全意做功课并且最有可能成为 Stackoverflow 上的“复制粘贴者” 的人要求“这样做是因为我做不到”。

关于css - 使用 javascript 将 div 的样式设置为 "none"或 "block"在 IE9 中不起作用,但在 Chrome 中有效,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/18964097/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com