click event not triggered on bootstrap modal
I am trying to catch the click event when save changes
is pushed.
For some reason i can't catch the click event.
Why?
<script> $('#inviteRequest').click(function(){ // e.preventDefault(); console.log(1); $('#myModalInviteDestination').modal('hide'); }); </script> <!-- Modal --> <div class="modal fade" id="myModalInviteDestination" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true"> <div class="modal-dialog"> <div class="modal-content"> <div class="modal-header"> <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button> <h4 class="modal-title" id="myModalLabel">Enter your friends email address</h4> </div> <div class="modal-body"> <textarea rows="5" cols="68" name="invites"></textarea> <div>use ; as delimiter</div> </div> <div class="modal-footer"> <button type="button" class="btn btn-default" data-dismiss="modal">Close</button> <button type="button" class="btn btn-primary" id="inviteRequest">Save changes</button> </div> </div><!-- /.modal-content --> </div><!-- /.modal-dialog --> </div><!-- /.modal -->
Answers
You need to wrap this in a document.ready:
$(function() {
$('#inviteRequest').click(function(){
console.log(1);
$('#myModalInviteDestination').modal('hide');
});
});
Your element#inviteRequest
does not exist at the time you try to add an event handler to it. You need to wait for the page to load first. My code is the equivalent to $(document).ready();
www.52newblog.com,本博客专注于励志、人生、名人、故事、时事热点等富有正能量文章的分享。是一款简洁美观、自适应的博客系统。