显示和隐藏div的javascript在IE中有效，但在FF或Chrome中不起作用

Question

我有一些跨度（准确地说是20），它们都具有ID。 然后，在样式表中将可见性设置为“隐藏”。

单击图像地图的一部分后，我制作了此脚本来显示和隐藏这些跨度：

function showDiv(pass) {
    var divs = document.getElementsByTagName('span');    
    for (i = 0; i < divs.length; i++) {
        if (divs[i].id.match(pass)) {
            (pass).style.visibility = 'visible';
            divs[i].style.visibility = 'hidden';
        }          
    }
} 

它可以在IE中完美运行，但FF不会让步，Chrome可以正常显示它并存在一些小问题，我认为我可以解决。

有人知道FF为什么不接受吗？ 任何建议将不胜感激，并在以后的生活中补偿:)

Answer 1

style.display = 'none';
style.display = 'inline';

编辑

这是我的资料

http://www.w3schools.com/css/pr_class_display.asp

Answer 2

这是因为您要传入一个字符串，然后再将其用作元素引用。 IE必须足够聪明才能搜索DOM并找到ID匹配字符串的元素。

尝试这个...

if (divs[i].id.match(pass)) {
    document.getElementById(pass).style.visibility = 'visible';
    divs[i].style.visibility = 'hidden';
}

或者，它可能是该String.match函数需要一个正则表达式。 如果以上方法仍不能解决您的问题，请尝试此...

if (divs[i].id.match(new RegExp(pass, 'gi'))) {

Answer 3

pass是一个ID。 在Firefox中，DOM中的元素ID不能用作全局引用。 你不能做id .style.visibility = 'visible'; 相反，您的函数应如下所示：

function showDiv(pass) {
    var divs = document.getElementsByTagName('span');    
    for (i = 0; i < divs.length; i++) {
        if (divs[i].id.match(pass)) {
            divs[i].style.visibility = 'hidden';
        }          
    }
    document.getElementById(pass).style.visibility = 'visible';
}

您应该可以设置循环外pass的visibility ，因为您只需要执行一次。

Answer 4

    if (divs[i].id.match(pass)) {

pass真的是一个正则表达式吗？ 在这里使用match似乎很不寻常。

        (pass).style.visibility = 'visible';

无论pass是字符串还是正则表达式都没有道理。 都没有style属性。 将变量放在括号中无效。 对于我来说，它不适用于任何浏览器，包括IE。

我猜你的意思是：

function showDiv(pass) {
    var divs= document.getElementsByTagName('span');    
    for (var i= 0; i<divs.length; i++)
        divs[i].style.visibility= divs[i].id==pass? 'visible' : 'hidden';
}

另请注意var i ：这是停止i成为全局变量所必需的。 当两个for i循环开始相互干扰时，这是一个非常常见的怪异错误源。