I want to open a modal with hash (example: www.example.com/#example.) This is my code below but the modal not showing. Thanks for your answer and I appreciate it.
$(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>
hashText allready have # so $('#'+hashText).modal('show');
should be $(hashText).modal('show');
and call openModalPopupClick
function on ready. i have update your code.
$(document).ready(function() {
$('.popup').click(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');
}
}
});
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With