2011-01-14 3 views
0

getElementById를 사용하는 일부 JavaScript에 문제가 있습니다. 그것은 FF, 사파리와 크롬에서 잘 작동하지만 IE (8 - 다른 시도하지 않은) 보석금. 내 자바 스크립트에서getElementById에 Internet Explorer 오류가 발생했습니다.

<div id="topnav"> 
    ... some HTML ... 
    <div> 
    <div id="sub_1" class="lowernav"> 
    ... some HTML ... 
    </div> 
    <div id="sub_2" class="lowernav"> 
    ... some HTML ... 
    </div> 

, 나는 topnav를 찾으려면 :

HTML의 해당 비트 사업부라는 topnav입니다.

내가 잘못 여기서 뭔가를하고 있는가 ...
<script> 

window.onload = init(); 

function init() { 
    // Show current menu 
    showCurrentMenu(); 
} 

function showCurrentMenu() { 
    hideMenus(); // Hide all menus and then show the current one 
    topnav = document.getElementById('topnav'); 
    ... rest of code ... 
} 

function hideMenus() { 
    var divlist = document.getElementsByTagName('div'); 
    for(var ii=0; ii<divlist.length; ii++) { 
    if(divlist[ii].className != divlist[ii].className.replace('lowernav','')) { 
    divlist[ii].className += ' hidden'; 
    } 
    } 
} 

가 ... 다음 다른 코드 아직 도달하지 않은 : (가 보석금 곳까지) 전체 코드는 무엇입니까? 그것은 정말로 명백한 무엇인가일지도 모른다. 그러나 나의 인생 동안, 나는 그것을 볼 수 없다! 모든 조언을 많이 주시면 감사하겠습니다.

ETA : 그것은 현재의 약자로 좋아, 여기에 전체 코드는 다음과 같습니다

<script> 
window.onload = init; 

function init() { 
    // Show current menu 
    showCurrentMenu; 
    // Attach 'onmouseover' event to main menu items 
    topnav = document.getElementById('topnav'); 
    // Get all items in list 
    var menulist = topnav.getElementsByTagName('a'); 
    for(var ii=0; ii<menulist.length; ii++) { 
    menulist[ii].onmouseover = showMenu; 
    } 

    document.getElementById('mainHomeNav').onmouseout = restoreMenu; 
} 

function restoreMenu(e) { 
    var targ; 
    if (!e) var e = window.event; 
    if (e.target) targ = e.target; 
    else if (e.srcElement) targ = e.srcElement; 
    if (targ.nodeType == 3) // defeat Safari bug 
     targ = targ.parentNode; 
    if (targ.id == "mainHomeNav") { 
    showCurrentMenu; 
    } 
} 

function hideMenus() { 
    var divlist = document.getElementsByTagName('div'); 
    for(var ii=0; ii<divlist.length; ii++) { 
    if(divlist[ii].className != divlist[ii].className.replace('lowernav','')) { 
    divlist[ii].className += ' hidden'; 
    } 
    } 
} 

function showCurrentMenu() { 
    hideMenus; 
    topnav = document.getElementById('topnav'); 
    // Get all items in list 
    var menulist = topnav.getElementsByTagName('a'); 
    for(var ii=0; ii<menulist.length; ii++) { 
    if(menulist[ii].className != menulist[ii].className.replace('thisSection','')) { 
    var thisid = menulist[ii].id; 
    var thissubmenu = document.getElementById(thisid + '_sub'); 
    thissubmenu.className = thissubmenu.className.replace(/hidden/g,''); 
    } 
    } 
} 

function showMenu() { 
    hideMenus; 
    // show this menu 
    var submenu_id = this.id + '_sub'; 
    var submenu = document.getElementById(submenu_id); 
    submenu.className = submenu.className.replace(/hidden/g,''); 
} 
</script> 

답변

4

문제는이 즉시 초기화 함수를 호출 한 다음과 같이 반환 값을 사용합니다

window.onload = init(); 

입니다 페이지의 onload 함수.

window.onload = init; 

페이지가 완전히로드 된 후에 만 ​​init 함수를 호출합니다.

+0

+1 올바른 답변입니다. 쉽게 실수를 할 수 있으며, 디버깅을 시도 할 때 쉽게 놓칠 수 있습니다. – Spudley

0

귀하의 문제는 다음 줄에있다 : init 이후

window.onload = init(); // this will CALL init() and assign the return value 

window.onloadundefined 될 것, 아무 것도 반환하지 않습니다.

IE에서 작동하지 않는 이유는 다른 브라우저에서 이미 다른 브라우저에서 DOM의 일부를 파싱 한 것이므로 showCurrentMenu에 대한 호출이 작동하기 때문입니다.

그러나 기술적 인 관점에서 문서를로드 할 수 보장되지 않기 때문에 그것은 단지뿐만 아니라 수행하여 당신이 window.onload에 실제 함수 참조를 할당해야한다는 고정, 깨질 수 :

window.onload = init; 
+0

고마워,하지만 난 그것을 변경하고 여전히 오류를주고있어. – Sharon

+0

@Sharon 그러면 코드를 더 보여줘야합니다. 지금 당장은 다른 오류를 만들 수 없기 때문입니다. –

+0

감사합니다. Ivo, 나는 게시물을 업데이트했습니다. – Sharon

2

문제가 발견되었습니다. '톱 메뉴'앞에 'var'이 없습니다.

그래서 대신

topnav = document.getElementById('topnav'); 

이 도움을

var topnav = document.getElementById('topnav'); 

모두에게 감사하고 있어야합니다.

+0

과 같은 좋은 자바 스크립트 튜토리얼을 읽으시기 바랍니다.이 질문은 정답입니다. –

+0

어떻게 든이 내 문제를 해결 .. –