2010-08-19 8 views
3

일부 (간단한) 코드를 사용하여 동적으로 만든 JQuery UI 탭을 제거하려고합니다. 불행히도, 그것은 협력하지 않습니다.JQuery UI 탭 제거

function removeTab(tabName) { 

     var tabIndex = -1; 
     $('#tabbedPanel > ul > li > a').each(
       function(i) { 
        if (this.href == tabName) { 
         tabIndex = i; 
        } 
       }); 

     $('#tabbedPanel').tabs("remove", tabIndex); 

    } 

불행하게도, 내가 할 모든 "개체가이 속성 또는 메서드를 지원하지 않습니다"입니다 :

여기 내가 사용 자바 스크립트 방법이다. 나는 탭 인덱스가 정확하다고 확신한다.

어떤 도움이 필요합니까?

+0

요 우리에게 전체 코드를 알려주시겠습니까? tab 변수/메소드는 어디에 있습니까? – corroded

+0

'.each()'다음에'tabIndex'를 경고하면 여전히 -1입니까? –

답변

0

DOM 문제입니다. 로드 된 JSP 조각에는 head 태그와 body 태그가있었습니다. 바로 위에 addTab() 메서드가 제대로 작동했기 때문에 즉시 catch하지 않았습니다.

1

다행입니다.

하나의 제안 - 탭을 반복하는 대신 탭 API를 사용하여 탭의 선택된 색인을 찾아서 훨씬 쉽게 제거 할 수 있습니다.

다음은 fiddle입니다. jQueryUI 데모 탭을 사용하여 몇 가지 기능을 추가했습니다.

핵심 부분은 'selected'옵션을 사용하고 있습니다. 나는, 클릭하면, 선택한 탭 인덱스를 경고하는 버튼 ...

$("#get_index").click(function(e) { 
    e.preventDefault(); 
    alert("Selected tab index = " + $("#tabs").tabs("option", "selected")); 
}); 

내가, 클릭하면, 선택한 인덱스를 얻을 후 제거 '제거'옵션을 사용하는 다른 버튼이 있습니다 그 탭. 당신이 href 이름과 일치하지 않아도이 방법은 ... 당신이 당신의 문제를 해결하더라도
$("#remove_selected").click(function(e) { 
    e.preventDefault(); 
    var selIndex = $("#tabs").tabs("option", "selected"); 
    $("#tabs").tabs("remove", selIndex); 
}); 

, 나는이를 공유하고자합니다. 희망이 도움이 !!