zoukankan      html  css  js  c++  java
  • 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">&times;</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(); 

  • 相关阅读:
    没有完成的题目
    哈尔滨工程大学 ACM online contest 1008 how many
    POJ 2976 分数规划
    长沙理工 ACM 数位 DP 1488
    POJ 2663
    USETC 1821 AC 自动机
    长沙理工 ACM 分数规划 1494
    正则表达式基础知识(转)
    上传头像代码
    datalist 分页(转)
  • 原文地址:https://www.cnblogs.com/sdream/p/5417637.html
Copyright © 2011-2022 走看看