2011-01-13 4 views
3

오늘 내 사이트에서 jQuery 아코디언을 사용했는데, 오늘 확인하기 전까지는 잘 작동하는 것으로 보입니다. 나는 몇 주 동안 HTML을 건드리지 않았다. 나는 accordion documentation을 처음부터 끝까지 보았습니다. 아무 것도 변한 것 같지 않아, 무슨 일이 일어나는지 전혀 모른다.jQuery 활성 상태 일 때 처음 클릭하면 아코디언이 깨집니다. false가 설정되었습니다.

아코디언 "active"속성을 "false"로 설정하여 아코디언이 문서로드시 활성 섹션을 표시하지 않도록했습니다. 또한 지정된 문서처럼 "접을 수 있음"을 "true"로 설정했습니다. 페이지의 다른 요소가 아닌지 확인하기 위해 가장 기본적인 아코디언 요소 만있는 완전히 새로운 페이지를 만들었지 만 여전히 작동하지 않습니다.

첫 번째 아코디언 섹션을 클릭 한 후 다른 섹션 중 하나를 클릭해도 작동하지 않는 문제가 있습니다. 나는 "활성"속성을 제거하는 것이이 문제를 해결했다는 것을 알았지 만, 당연히 문서로드에 열려있는 활성 섹션이 있습니다. 나는 원하지 않습니다. 허위 및 축소 떠나 :

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script> 
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"></script> 
<script> 
    $(document).ready(function() { 
    $("#accordion").accordion({active: false, alwaysOpen: true, autoHeight: false, collapsible: true}); 
    }); 
</script> 
</head> 
<body> 
<div id="accordion"> 

    <p><a href="#">1</a></p> 
    <div>this</div> 

    <p><a href="#">2</a></p> 
    <div>isn't</div> 

    <p><a href="#">3</a></p> 
    <div>working</div> 

    <p><a href="#">4</a></p> 
    <div>correctly</div> 

</div> 
</body> 
</html> 

나는 또한 내가 활성을 제거하는 경우 것으로 나타났습니다 사실, 난 단지 수 있어요 다음 섹션 두 번 "붕괴", 그리고 섹션을 잠그고 붕괴 중지 적 있었 같은 일을하는 /열리는. 자동 jQuery를하고 jQuery를 UI 모두의 최신 버전을 제공 받게됩니다

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script> 
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"></script> 

revision (버전에서 마지막 세 번째 자리)를 지정하지 않음으로써 :

답변

3

글쎄, 내가 immediatly 다음과 같은 문제를 보았다. 왜 jQuery UI가 업데이트되어 UI Accordion이 변경 되었기 때문에 갑자기 작동하지 않는 이유는 무엇입니까?

가장 좋은 방법은 수정 버전을 지정하는 것입니다. 현재 버전 (1.8.7)에서 아래로 내려 가서 작동 할 때까지 아래로 내려갑니다. 예를 들어, alwaysOpen 열기가 제거되거나 변경되었습니다. docs을 확인하고 사용할 수있는 옵션을 확인해야합니다.

또한, jsFiddle에 내가 일하고있어 한 어떤이를 시도 할 수 있습니다 :

$(function(){ 
    $("#accordion").accordion({ 
     active: false, 
     autoHeight: false, 
     collapsible: true 
    }); 
}); 
+0

덕분에, 그 일을!나는 다음 번에 버전 번호를 기억할 것이다. – Sean

0

heightStyleType

제어 아코디언과 각 패널의 높이. 가능한 값은 :

  • "자동차는" : 모든 패널은 가장 높은 패널의 높이로 설정됩니다.

  • "채우기" : 아코디언의 상위 높이를 기준으로 사용 가능한 높이로 확장합니다.

  • "콘텐츠" : 각 패널의 내용은 단지 그 높이만큼입니다.

코드 예제 :

$(function(){ 
    $("#accordion").accordion({ 
     active: false, 
     heightStyle: "content", 
     collapsible: true 
    }); 
}); 
관련 문제