引導崩潰回調函數，它是內部模式不起作用

這裏是我的代碼引導崩潰回調函數，它是內部模式不起作用

<div class="modal fade" id="Art" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true"> 

    <div class="modal-dialog modal-lg" style="opacity: 0.85;"> 

     <div class="modal-content" style="background-color: #687077;" > 

      <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="myModalLabel1">Art</h4> 
      </div> 

      <div class="modal-body"> 
       <div class="panel-group" id="accordion1" > 

        <div class="panel panel-default" style="border-width: 3px"> 
         <div class="panel-heading" style="background-color: gray"> 
          <h4 class="panel-title" style="color: black"> 
           <a data-toggle="collapse" data-parent="#accordion1" href="#collapse1">Media</a> 
          </h4> 
         </div> 
         <div id="collapse1" class="panel-body collapse in"> 
          <div class="panel-body" style="background-color: #687077"> 
           <div class="table1container" id="yt-player"> 
            <iframe id="art_video" width="830" height="400" src="https://www.youtube.com/embed/BCkHnvDGWOY?autoplay=1" frameborder="0" allowfullscreen></iframe> 
           </div> 
          </div> 
         </div> 
        </div> 

        <div class="panel panel-default" style="border-width: 3px"> 
         <div class="panel-heading" style="background-color: gray"> 
          <h4 class="panel-title" style="color: black"> 
           <a data-toggle="collapse" data-parent="#accordion1" href="#collapse2">Content</a> 
          </h4> 
         </div> 
         <div id="collapse2" class="panel-collapse collapse"> 
          <div class="panel-body" style="background-color: #687077"> 
           <div class="table1container"> 
            <embed src="move.pdf" width="800px" height="800px" /> 
           </div> 
          </div> 
         </div> 
        </div> 
       </div> 
      </div> 

      <div class="modal-footer"> 

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

，我寫這樣

$(document).ready(function() { 
    $('#collapse1').on('hidden.bs.modal', function (e) { 
     alert("it will not be printed"); 
    }); 
});

我想用回調函數來聽collapse1 JS是否顯示或隱藏來控制YouTube視頻播放或停止。例如當collapse1顯示時，然後播放視頻。當它隱藏時，然後停止視頻。我只是寫了隱藏的功能。但問題是，回調函數不起作用！應該出現警告窗口。如何處理這個問題？

來源

2016-09-23 Ghj Chen ghj0504520

你應該在模態的對話中使用「ID = collapse1」，而不是在板體，像這樣：

<div id="collapse1" class="modal-dialog modal-lg" style="opacity: 0.85;">

來源

2016-09-23 03:28:19

試試這個，hide.bs.collapse工作對我

$(document).ready(function() { 
    $("#collapse1").on("hide.bs.collapse", function(){ 
     alert("it will not be printed"); 
     }); 
});

我使用了這個版本的引導

<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"> 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script> 
    <script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>

來源

2016-09-23 03:58:15

但它不再適用於我，這個問題是否涉及引導版本？ –

我使用了bootstrap版本，將它放在head標籤中，別忘了你需要jquery來運行bootsrap –

引導崩潰回調函數，它是內部模式不起作用

回答

相關問題