2017-10-10 4 views
2

ハッシュでモダルを開きたい(例:www.example.com/#example)これは私のコードですが、モーダルは表示されません。あなたの答えをありがとう、私はそれを感謝します。ハッシュでモダルを開く

$(document).ready(function() { 
 
    $('.popup').click(openModalPopupClick); 
 

 
      function openModalPopup(){ 
 
      var hashText = window.location.hash.substr(); 
 
      if (hashText){ 
 
       $('#'+hashText).modal('show'); 
 
      } 
 
      } 
 

 
      function openModalPopupClick(){ 
 
      var hashText = $(this).attr('href'); 
 
      if (hashText){ 
 
       $(hashText).modal('show'); 
 
      } 
 
      } 
 
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous"> 
 
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script> 
 

 
<a href="#regis-new-company" class="popup" role="button">click</a> 
 
<div class="modal fade" id="regis-new-company" role="dialog" aria-labelledby="myLargeModalLabel"> 
 
    <div class="modal-dialog modal-lg"> 
 
    <div class="modal-content"> 
 
     <div class="modal-header"></div> 
 
     <div class="modal-body"></div> 
 
     <div class="modal-footer"></div> 
 
    </div> 
 
    </div>  
 
</div>

+0

私はあなたの質問を 'bootstrap' cdnで更新しました。これは動作しているように見えますが、あなたの問題はほとんど分かりません。'#regis-new-company' – Pedram

答えて

0

hashTextが出回っので$('#'+hashText).modal('show');$(hashText).modal('show');ことや準備にopenModalPopupClick関数を呼び出す必要があります#を持っています。私はあなたのコードを更新しました。

+0

ちょっと@zeeshan Anjum、ありがとう、あなたのコードが働いた!しかし、今私は私の崩壊に別の問題があります。関数openModalPopup();私の崩壊アコーデオンと同じページで競合する私が折りたたみ機能のためにそのページに別のhastag URLを入力すると、openModalPopup();常にページを表示するので、半分灰色のポップアップ背景が表示されます。 –

+0

if(location.hash!= null && location.hash!= ""){ $( '。collapse')。removeClass( 'in'); $(location.hash + '.collapse')。崩壊( 'show'); } \t \t \t //ポップアップリンク \t $( 'ポップアップ')(openModalPopupClick)をクリックします。 function openModalPopup(){ var hashText = window.location.hash.substr(); if(hashText){ $(hashText).modal( 'show'); } } openModalPopup(); function openModalPopupClick(){ var hashText = $(this).attr( 'href'); if(hashText){ $(hashText).modal( 'show'); } } –

+0

openModalPopup関数が呼び出す必要があるときに条件を追加できます。 'if(hashText =="#open-modal ")openModalPopup();' –

関連する問題