2015-01-15 21 views
0

최근 프로젝트에서 트위터 부트 스트랩을 사용하고 있습니다. 페이지 중 하나를 제외하고 모두 잘 작동합니다.부트 스트랩 모달 문제

링크를 클릭하면 모달의 오른쪽 상단 모서리에있는 닫기 버튼 또는 닫기 아이콘을 사용하여 닫을 수있는 모달이 나타납니다.

닫기 버튼을 사용하여 모달을 닫은 다음 다시 버튼을 열거 나 닫기 버튼을 사용할 수 없으며 상단 오른쪽 아이콘을 사용하여 모달을 닫을 수 있습니다.

다음은 결과를 볼 수있는 내 코드 사본이있는 jsfiddle로 연결되는 링크입니다.

링크에 의해 데이터가 전달되는 모달이 하나 있지만 아직 구현되지 않았습니다.

<h3>Select a role to edit it.</h3> 
<div style="width:auto"> 
<ul class="nav nav-pills nav-stacked"> 
<li><a href="#" data-toggle="modal" data-target="#roleEditModal">(920)Active Directory Management</a></li> 
<li><a href="#" data-toggle="modal" data-target="#roleEditModal">(904)Cisco Router - Administration </a></li> 
<li><a href="#" data-toggle="modal" data-target="#roleEditModal">(914)Cisco Router - Installation</a></li> 
<li><a href="#" data-toggle="modal" data-target="#roleEditModal">(918)Development - Analysis</a></li><li><a href="#" data-toggle="modal" data-target="#roleEditModal">(908)Development - Project Management</a></li> 
<li><a href="#" data-toggle="modal" data-target="#roleEditModal">(936)Fire Wall - Administration</a></li> 
</ul> 
</div>   
     <!-- Modal --> 
     <div class="modal" id="roleEditModal" tabindex="-1" role="dialog" aria-labelledby="roleEditModalLabel" aria-hidden="true"> 
      <div class="modal-dialog"> 
      <div class="modal-content"> 
      <div class="modal-header"> 
      <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button> 
      <h4 class="modal-title" id="editModal">Edit role:</h4> 
      </div> 
      <div class="modal-body"> 

      </div> 
      <div class="modal-footer"> 
      <button type="button" id="btn_roleEditClose" class="btn btn-default" data-dismiss="modal">Cancel</button> 
</div> 
</div> 
</div> 
</div> 

http://jsfiddle.net/dzfbyu6t/

누군가는 그것을 살펴보고 내 문제입니다 알려 수 없습니다. 감사합니다.

답변

1

추가 한 자바 스크립트가이 문제의 원인입니다.

$(".btn").click(function(e) { 
    if (! $(this).hasClass("disabled")) 
     { 
      $(".disabled").removeClass("disabled").attr("rel", null); 

      $(this).addClass("disabled").attr("rel", "tooltip"); 
     } 
    }); 

이 내용을 잘 설명하면 문제가 없습니다. http://jsfiddle.net/dzfbyu6t/1/