2010-04-26 4 views
2

내 tabcontainer를 제어하는 ​​Jquery 스크립트가 "개체 예상"런타임 오류를 발생시킵니다.Jquery 런타임 오류 : 예상 한 개체

$(document).ready(function() { 



//When page loads... 
$(".tab_content").hide(); //Hide all content 
$("ul.tabs li:first").addClass("active").show(); //Activate first tab 
$(".tab_content:first").show(); //Show first tab content 

//On Click Event 
$("ul.tabs li").click(function() { 

    $("ul.tabs li").removeClass("active"); //Remove any "active" class 
    $(this).addClass("active"); //Add "active" class to selected tab 
    $(".tab_content").hide(); //Hide all tab content 

    var activeTab = $(this).find("a").attr("href"); //Find the href attribute value to identify the active tab + content 
    $(activeTab).fadeIn(); //Fade in the active ID content 
    return false; 
}); 

}); 

스타일 시트와 함께 할 그 무언가를 가지고 : 솔직히 이유를 찾을 수 없습니다 ?

+2

오류를 어느 라인에서 발생합니까? –

+0

당신이 오류에 대한 더 많은 정보를 제공하고 어디에서 답을 얻기가 힘들지 만 않는 한. jQuery 스크립트 파일을 올바르게 포함 시켰습니까? 실행할 최소한의 요소 만 포함되어있는 HTML 페이지에서 코드를 실행하는 것은 어떻습니까? –

+1

jquery.js에 링크 했습니까? – Glennular

답변

3

난 당신이 jQuery를 스크립트를 포함하는 기억 $(document).ready(function() { @ 오류를 받고하는 경우가 선택

activeTab.fadeIn(); //Fade in the active ID content 

에서 당신에게 var을 제거 할 생각합니다.

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js" type="text/javascript"></script>

+0

아니, 아직 오류가 발생했습니다 ... – Joris

+0

var를 제거하는 것에 대해 확실하지 않습니다. 아무 것도 변경되지 않습니다 .jQuery를 포함하면 도움이 될 수 있습니다. –

+0

아! 스크립트 src = "http : //ajax.googleapis. com/ajax/libs/jquery/1.3/jquery.min.js "type ="text/javascript "> 내가 누락되었습니다. 감사합니다! – Joris

1

편집 해 나는

귀하의 문제가이 라인입니다 :-) 잘못 처음이었다 같이

var activeTab = $(this).find("a").attr("href"); //This will return a string value 
$(activeTab).fadeIn();        //Meaning this will fail 

당신은 activeTab이 표시하려는 .tab_content를 얻을 수의 선택을 변경해야합니다.

href 값이 .tab_content 어딘가에 포함되어 있다고 가정합니다.

+0

나는 이것이 정확하다고 생각하지 않습니다. 그는 콘텐트 위에 탭을 가지고 있습니다. 대부분의 탭 스트립처럼 작동합니다. 콘텐트는 별도의 div에 있습니다. –

+0

아니요, 여전히 오류가 발생합니다. 또한 오류가 $ (document) .ready ('')에서 발생하면 – Joris

+0

오류가 발생할 수 있습니다. $ (document) .ready (function() { line ... 줄 다음 내 추측 jquery 올바르게 포함되어 있지 않습니다. 귀하의 URL이 올바른지 확인하십시오. 그냥 코드를 HTML 테스트 페이지에서 거기에 표시하고 제대로 작동합니다. –

3

귀하의 코드는이 HTML 페이지에서 작동;

<html> 
<head> 
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js" type="text/javascript"></script> 
<script> 

$(document).ready(function() { 

    //When page loads... 
    $(".tab_content").hide(); //Hide all content 
    $("ul.tabs li:first").addClass("active").show(); //Activate first tab 
    $(".tab_content:first").show(); //Show first tab content 

    //On Click Event 
    $("ul.tabs li").click(function() { 

     $("ul.tabs li").removeClass("active"); //Remove any "active" class 
     $(this).addClass("active"); //Add "active" class to selected tab 
     $(".tab_content").hide(); //Hide all tab content 

     var activeTab = $(this).find("a").attr("href"); //Find the href attribute value to identify the active tab + content 
     $(activeTab).fadeIn(); //Fade in the active ID content 
     return false; 
    }); 

    }); 

</script> 
</head> 
<body> 

    <ul class="tabs"> 
     <li><a href="#one">Tab One</a></li> 
     <li><a href="#two">Tab Two</a></li> 
    </ul> 

    <div id="one" class="tab_content">Tab One Content</div> 
    <div id="two" class="tab_content">Tab Two Content</div> 
</body> 
</html> 

그래서 다른 코드가 표시되어야합니다?

관련 문제