2010-03-10 10 views
1

왜 두 함수가 내가 thead를 클릭했을 때의 이상한 동작을하는 이유는 tbody가 확장 된 다음 축소 된 이유입니다.jQuery 함수의 이상한 동작

두 번째 함수에서 if, else 문에 경고를 추가하는 일부 테스트를 수행 할 수 있지만 if 문에만 들어가서 slideUP 만 수행합니다.

내가 알아 차린 또 다른 사실은 tbody에 단 하나의 행만 있으면 잘 작동한다는 것입니다. 왜?

나는 또한 false를 반환하려고했지만, 아무것도, 두 번이나 다른 장소에서 호출하지 않는 함수.

이 문제를 해결할 수 있으면 감사하겠습니다.

감사합니다.

Function 1 
$(function() { 
    $("table.section thead").click(function() { 
    $(this).next("table.section tbody").slideToggle("slow"); 

    }); 
}); 

Function 2 
$(function() { 
    $("table.section thead").click(function() { 
     var body = $(this).next("table.section tbody"); 
     if (body.is(":visible")) 
     body.slideUp("slow"); 
     else 
     body.slideDown("slow"); 
    }); 
}); 

UPDATE 표

<table> 
<thead> 
<tr><td>heading></td></tr> 
</thead> 
<tbody> 
<tr><td>content1</td></tr> 
<tr><td>content2</td></tr> 
</tbody> 
</table> 
+0

이 두 기능이 동시에 바인딩되었거나이 두 가지 시도가 동일한 작업을 수행합니까? – Sorpigal

+0

테이블을 보여줄 수 있습니까? – hallie

+0

OP 중복 된 질문 http://stackoverflow.com/questions/2415999/jquery-help-converting-simple-function-please-help/2416034#2416034 –

답변

0

JQuery 메일 링리스트를 살펴 보았습니다. 테이블을 처리하고 완전히 다르게 차단하는 방식 때문에 브라우저 의존도가 높습니다.

$(function() { 
    $("table.section thead").click(function() { 
    $(this).next("tbody").animate({opacity: 'toggle'}); 
    }); 
}); 

동적으로 개별 테이블 구성 요소의 크기를 조정하고 교차 할 갖는 대신 나는 이런 식으로 뭔가를 몸을 퇴색 대신 다른 요소에 머리를하려고 전체 테이블을 슬라이드, 또는 것 -browser가 jQuery 프레임 워크에서 해결할 가치가없는 것으로 보이므로 언제든지 변경 될 것으로 기대하지는 않습니다.

0

그것은 불분명하지만 당신은 스크립트에서이 두 가지를 한 경우합니다 (.click를 호출)를 두 번 동일시되는 :

$(function() { 
    $("table.section thead").click(function() { 
     $(this).next("table.section tbody").slideToggle("slow"); 
     var body = $(this).next("table.section tbody"); 
     if (body.is(":visible")) 
     body.slideUp("slow"); 
     else 
     body.slideDown("slow"); 
    }); 
});