在Internet Explorer 8中,Javascript onclick事件不起作用。

问题描述 投票:1回答:2

我有以下一行代码,在Firefox、Chrome和Safari中都能正常工作,但在internet explorer 8中就不行了。

<a href="javascript:void(0);" onclick="showHide('reading','type_r','r');">Show me the example</a>

该函数只是在点击超链接时显示和隐藏一个div。

我在这里有什么遗漏的地方吗?

这就是 showHide 函数。

function showHide(elementId,parentId,qtype) {

    if (document.getElementById && !document.all) {

        var elementParent = document.getElementById(parentId);
        var element = document.getElementById(elementId);
        var upArrowId = 'up-arrow-'+qtype;
        var downArrowId = 'down-arrow-'+qtype;

        if(element.style.visibility == 'hidden'){

            elementParent.style.height = 'auto';
            element.style.visibility = 'visible';
            document.getElementById(upArrowId).style.visibility = 'visible';
            document.getElementById(downArrowId).style.visibility = 'hidden';
        }
        else if(element.style.visibility == 'visible'){
            element.style.visibility = 'hidden';
            elementParent.style.height = '50px';
            document.getElementById(upArrowId).style.visibility = 'hidden';
            document.getElementById(downArrowId).style.visibility = 'visible';      
        }
    }
}
javascript onclick internet-explorer-8 dom-events
2个回答
1
投票

!document.all 将IE从你的函数的代码执行中排除。


1
投票

你的Javascript代码应该是这样的。

function showHide(elementId,parentId,qtype) { 

    var elementParent = document.getElementById(parentId); 
    var element = document.getElementById(elementId); 
    var upArrowId = 'up-arrow-'+qtype; 
    var downArrowId = 'down-arrow-'+qtype; 

    if(element.style.visibility == 'hidden'){ 

        elementParent.style.height = 'auto'; 
        element.style.visibility = ''; 
        document.getElementById(upArrowId).style.visibility = ''; 
        document.getElementById(downArrowId).style.visibility = 'hidden'; 
    } 
    else if(element.style.visibility == ''){ 
        element.style.visibility = 'hidden'; 
        elementParent.style.height = '50px'; 
        document.getElementById(upArrowId).style.visibility = 'hidden'; 
        document.getElementById(downArrowId).style.visibility = '';       
    } 
}

!document.all是为了让IE停止运行。另外,你不应该检查visibilty == 'visible',因为它一开始就不会工作。(默认值是"",所以你应该使用它,除非你已经明确地在元素上设置了可见性="可见")

但最重要的是--谷歌jQuery!在你意识到之前,你会用元素.toggle()代替所有这些。在你意识到这一点之前,你会用 element.toggle()来代替所有这些。

© www.soinside.com 2019 - 2024. All rights reserved.