javascript onmouseover可见性切换3个单独的div'；s

我试图有三个图像链接显示三个单独的div的（分别）当onMouseOver

<script type="text/javascript">
function toggleVisibility(divid) {
if (divid="1"){
    document.getElementById("1b").style.visibility = "visible";
    document.getElementById("2b").style.visibility = "hidden";
    document.getElementById("3b").style.visibility = "hidden";
}
else if (divid="2")
{
    document.getElementById("1b").style.visibility = "hidden";
    document.getElementById("2b").style.visibility = "visible";
    document.getElementById("3b").style.visibility = "hidden";
}
else if (divid="3")
{
    document.getElementById("1b").style.visibility = "hidden";
    document.getElementById("2b").style.visibility = "hidden";
    document.getElementById("3b").style.visibility = "visible";
}
}
</script>

但是,

当onMouseOver时，所有3个都显示1a。这就是它所做的一切

当其他2个翻滚时，1a不会隐藏，2a+3a根本不显示

谢谢

HTML+CSS：

<div id="wrapper">
<div style="width:910px;height:300px;margin:0;padding:0;">
<div id="1b">&nbsp;</div>
<div id="2b">&nbsp;</div>
<div id="3b">&nbsp;</div>
<a href="#" onmouseover="toggleVisibility('1');" class="1"></a>
<a href="#" onmouseover="toggleVisibility('2');" class="2"></a>
<a href="#" onmouseover="toggleVisibility('3');" class="3"></a>
</div>
</div>

#wrapper {
width: 896px;
margin: 0px auto;
text-align: left;
overflow: hidden;
}

#1b {
width:303px;
height:150px;
visibility:hidden;
float:left;
background-color:#DED6C5;
}

.1 {
float:left;
height:130px;
width:303px;
display:block;
background-image:url('images/organizational.jpg');
}

#包装纸{
宽度：896px；
保证金：0px自动；
文本对齐：左对齐；
溢出：隐藏；
}
#1b{
宽度：303px；
高度：150像素；
可见性：隐藏；
浮动：左；
背景色：#DED6C5；
}
.1 {
浮动：左；
高度：130像素；
宽度：303px；
显示：块；
背景图片：url（'images/organization.jpg'）；
}

我把这篇文章中的名字改为“1，2，3，1b，2b，3b”，以便于清理和理解

---

其他的CSS与1和1b相同，只是名称更改了。

您的错误在您的条件下

当使用

if

时，有效的运算符是

|

&

=

=

=
，但您使用的是
=

尝试使用
==
，它应该可以工作

编辑：

添加了一个很好的优化你的代码，你应该看看
 除了关于正确条件格式的答案之外，我建议更新可见性切换函数，以减少重复代码的数量，从而在需要时更容易添加更多的潜水。这样的方法对您来说应该很有效，因为它循环使用您拥有的div数，并执行1个条件检查以查看传入的div数是否与循环迭代值匹配，并相应地设置可见性

function toggleVisibility(divid) {
    var i;
    for (i = 1; i < 4; i += 1) {
        if (divid === i) {
            document.getElementById(i + "b").style.visibility = "visible";
        } else {
            document.getElementById(i + "b").style.visibility = "hidden";
        }
    }
}

功能切换可见性（divid）{
var i；
对于（i=1；i<4；i+=1）{
if（divid==i）{
document.getElementById（i+“b”）.style.visibility=“visible”；
}否则{
document.getElementById（i+“b”）.style.visibility=“hidden”；
}
}
}

希望有帮助
 如果您能够忍受将链接移动到div上方（或通过一些巧妙的定位），就有可能获得一个无javascript的解决方案

例如：

概念：

.org:hover ~ #orginfo {
     visibility: visible;   
}

对于这个问题，如果不查看相关的HTML.add-onmouseout事件来返回元素的可见性，就很难给出答案。这可能是因为您没有为
2b
和
3b
指定任何维度？无法发现任何其他内容。@techfoobar 2b和3b的CSS在代码中，我只是没有发布它们，因为它们的样式与1b相同。2&3和1也是一样。直到我做了一把小提琴，我才错过了它！我明白了，如果你以一个数字开始你的
类
或
id
，CSS就不起作用了。我发现了3个错误。1:脚本标记必须位于
头部
。2:如果（x==y）
，则
==
必须在
中。3:
样式。可见
只需1
=
。我希望以后它会对你有用！没什么大不了的，但是你可以在for:
for（var i=1；…）
中声明你的
var i
。这都是个人喜好。我喜欢var块，而不是在我所有的代码中乱扔它们：-）谢谢！很好的建议，它确实清理了很多。是的，我正试图找出那个技巧哈哈。非常感谢，我马上就来试试！
.org:hover ~ #orginfo {
     visibility: visible;   
}