부트 스트랩 4 모달 숨기기가 작동하지 않음

Question

부트 스트랩 v3.3.7에서 아래 코드가 정상적으로 작동합니다. 최근에 Bootstrap v4.0.0-beta.2로 업그레이드하려고 시도한 이유가 있습니다.

내가하고있는 일은 회전자가있는 모달 div를 보여주는 것입니다. 그런 다음 나머지 페이지를로드하고 나머지 페이지를 모두로드하면 모달 div가 닫힙니다. 다시 v3에서 제대로 작동하며 v4에서 더 이상 작동하지 않습니다. 그러나 콘솔을 열고 $ ("# divLoading")을 실행시킬 수 있습니다. 모달 ('숨기기'); 그리고 사업부가 사라집니다.

이

뿐인 Boostsrap의 V4의 [파산] : https://jsfiddle.net/7skoLo2q/

<div id="divMain" class="Main"> 
       <div id="divLoading" class="modal fade"> 
        <div class="loader"> 
         <br /> 
         <br /> 
         loading div actual div has a spinner but not need to show error 
        </div> 
        <div class="modal-dialog invisible"> 

        </div> 
       </div> 
      </div> 

자바 스크립트 : https://jsfiddle.net/gc1097oh/
뿐인 부트 스트랩 v3은 [WORKS]

<script type="text/javascript"> 
    $(function() { 
     showLoading(); 
     //do some work then hide 
     hideLoading(); 
    }); 


    function showLoading() { 
     $('#divLoading').modal({ 
      backdrop: 'static', 
      keyboard: false 
     }); 
    } 

    function hideLoading() { 
     $("#divLoading").modal('hide'); 
    } 
</script> 

Answer 1

조동사는 비동기 방식으로 생성되지만 호출 showLoading() 및 hideLoading()은 동기식으로 작동합니다. 다음과 같이 hideLoading 함수에 모달이 이미 표시되어 있는지 확인할 수 있습니다.

function hideLoading() { 
    $('#divLoading').on('shown.bs.modal', function (e) { 
     $("#divLoading").modal('hide'); 
    }) 
}