모달

2017-12-24 2 views
0

* 포스트
나는 주위를 검색하고 여러 개의 이미지에 대해 하나 개의 페이지에 모달를 추가 에 잠재적 인 해답을 발견했다를 반복합니다. 내가 찾은이 솔루션은 내 모달을 제공하고 있지만 모달이 튀어 나오면 이미지가 표시되지 않고 "img src"를 보여주는 콘솔이 "(알 수 없음)"입니다. 내가 찾은모달

솔루션은 :

$(document).ready(function() { 
 
     $('#myModal').on('show.bs.modal', function (e) { 
 
      var image = $(e.relatedTarget).attr('src'); 
 
      $(".img-responsive").attr("src", image); 
 
     }); 
 
});
<img id="1" data-toggle="modal" data-target="#myModal" class="image" src="/images/hieroglyphics/9.jpg"> 
 

 

 

 
<div id="myModal" class="modal fade" role="dialog"> 
 
    <div class="modal-dialog"> 
 
     <div class="modal-content"> 
 
      <div class="modal-body"> 
 
       <img class="img-responsive" src=""/> 
 
      </div> 
 
      <div class="modal-footer"> 
 
       <button type="button" class="btn btn-default" data-dismiss="modal">Close</button> 
 
      </div> 
 
     </div> 
 
    </div> 
 
</div>

는 어떤 도움을 크게 감상 할 수있다! 감사!

답변

1

코드가 올바르게 작동하는지 확인할 수 있습니다.
여기에 코드가 있습니다.
https://jsfiddle.net/jammer99/y0w1t95u/

모달을 여는 다른 방법이 있습니까?

$(document).ready(function() { 
    $('#myModal').on('show.bs.modal', function (e) { 
     var image = $(e.relatedTarget).attr('src'); 
     $(".img-responsive").attr("src", image); 
    }); 
}); 

콘솔의 스크린 샷을 붙여 넣을 수 있습니까? 다른 오류가 있는지 확인 하시겠습니까?

+0

다른 오류가 발생하지 않습니다. 이 Javascript가 JQuery를 통해 실행되었거나 잘못 되었습니까? –

+0

실제로 부트 스트랩 css CDN을 추가했는데이 오류가 발생했습니다 ... "예상치 못한 토큰 {bootstrap.min.css : 5"Uncaught SyntaxError : –

+0

부트 스트랩 3.3.7을 사용하고 있습니까? 당신은 당신의 문제로 바이올린을 업데이트 할 수 있습니까? –

관련 문제