2011-05-03 3 views
0

"탭 추가"버튼을 사용하여 동적 탭을 만듭니다.생성 후 jquery의 동적 탭을 선택하지 못했습니다.

"탭 추가"버튼이 탭의 끝에 추가 된 다음 탭이 초기화됩니다 (예 : 은 "탭 추가"버튼 (LI가 실제로 임) .tabs를 사용하여 생성 된 새로운 탭을 클릭

enter image description here

$('#tabs').sortable({ 
    create: function(event, ui) { 
     $tabs = $('#tabtab').tabs({ 
      create: function(event, ui) { 
       $('#tabs').append('<li id="tab-add" class="noSort"></li>'); 
      }, 
      add: function(event, ui) { ... 

('추가'HREF 입력) 표기법. 그런 다음 생성 된 탭 li에 입력 필드를 삽입합니다. 그러면 새로 생성 된 li 내의 기본 생성 링크가 제거됩니다.

enter image description here

<li id="tab-1"> 
    <input type="text" id="tab-input"></input> 
</li> 

enter image description here

입력이 아이디로 반환되는 데이터베이스와 올바른 리 구문에 게시 입력에서 수집 한 정보를 포커스를 잃었을 때 잘 작동 "탭-1" .

<li id="tab-1"> 
    <a href="#tabs-1">The Name of My New Tab</a> 
</li> 

자, 여기가 붙어 있습니다.

올바른 탭이 선택되고 (위 참조) 패널이 표시되지만 이미 생성 된 다른 탭을 클릭 한 다음 방금 생성 된 탭을 클릭하면 탭이 선택되지 않습니다 (아래 참조). "새 탭의 이름"탭을 클릭하면 선택되지 않습니다 (강조 표시).

enter image description here

이 "탭-1"의 내용이 동적으로 생성되고 탭 자체를 재생하지 않은 사실과 함께 할 수있는 뭔가가. 이후로 내가 다른 탭을 추가하면 탭이 잘 작동하기 시작합니다. 페이지를 새로 고치고 싶지 않습니다. 해당 탭이 생성 된 직후에 바로 작동하게하고 싶습니다. 탭을 선택,로드 및 활성화하는 데 아무런 효과가 없었습니다.

동적 접근 후에 탭을 재생성하는 방법이 있습니까?

나는이 읽기가 너무 지루하지 않았 으면 좋겠다. 어떤 도움이라도 대단히 감사 할 것입니다.

답변

2

좋아요, 이제 알겠습니다. 문제는 새 탭을 추가 할 때 jquery.ui 코드가 사용자가 대체 할 태그에 핸들러를 연결한다는 것입니다. 이 태그를 대체하는 대신 숨기기 만하면됩니다. 그런 다음 입력에 포커스가 없어지면 jquery.ui로 작성된 텍스트 내부의 텍스트를 변경하고 다시 표시하십시오. 이렇게하면 jquery.ui에 의해 모든 핸들러가 연결됩니다.

+0

두려움 나는 지금 당장 필요한 예제를 제공 할 라이브 서버가 없습니다. – HGPB

+0

나는 어떤 스크린 샷을 추가 할 수 있었다. – HGPB

+0

이것은 코멘트가 아니었다. 대답이 아니었다. 아무도 나에게 소리 지르지 않는다! –