未定义onclick返回函数

Question

我有一个Bootstrap模式，用于更改用户密码。 但是，问题在于，无论我怎么尝试，都无法通过onclick或使用.on将按钮附加到事件.on该事件。 它根本不会识别它。

我尝试将<script>标记放在模式上方，模式下方，甚至模式内部，只是为了始终使onclick返回Uncaught ReferenceError: updatePassword is not defined 。 然后，我删除了onclick ，为提交按钮分配了ID，然后尝试了$('#update-password').on('click', function() { ... }); 但这根本不被认可。

所有这些的罪魁祸首几乎肯定是Bootstrap模态，我猜想它与浏览器在页面加载时如何处理它有关。

-

语气

<!-- Modal -->
<div class="modal fade" id="changePasswordModal" tabindex="-1" role="dialog" aria-labelledby="changePassModalLabel" aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content">
            <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="changePassModalLabel">Change Password</h4>
            </div>
            <div class="modal-body">
                <div class="col-md-12">
                    <div class="alert alert-password" style="display: none;">
                        <p></p>
                    </div>
                </div>
                <form role="form" action="#" method="post">
                    <div class="form-group">
                        <label for="password-current">Current Password<span>*</span></label>
                        <input type="password" class="form-control" id="password-current" name="pass-curr" placeholder="Current password...">
                    </div>
                    <hr>
                    <div class="row">
                        <div class="col-md-6">
                            <div class="form-group">
                                <label for="password-new">New Password<span>*</span></label>
                                <input type="password" class="form-control" id="password-new" name="pass-new" placeholder="New password...">
                            </div>
                        </div>
                        <div class="col-md-6">
                            <div class="form-group">
                                <label for="password-new-conf">Confirm New Password<span>*</span></label>
                                <input type="password" class="form-control" id="password-new-conf" name="pass-new-c" placeholder="Confirm new password...">
                            </div>
                        </div>
                    </div>
                </form>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">Cancel</button>
                <button type="button" class="btn btn-primary" onclick="updatePassword()">Update Password</button>
            </div>
        </div>
    </div>
</div>

脚本

<script>
    function updatePassword(){
        console.log('foo');
        /*$.ajax({
            url: url+"ajax/update_password",
            data: {pass-curr : pass-curr, pass-new : pass-new, pass-new-c : pass-new-c},
            async: false,
            success: function(data) {

            },
            error: function(data) {
                $('#alert-password').removeClass('alert-success').addClass('alert-danger').html('<p><strong>Sorry, an error occurred!</strong></p><p>'+data.additional+'</p>').slideDown(200, function() {
                    $('#alert-password').delay(4000).slideUp(200);
                });
            }
        })*/
    };
</script>

我很抱歉，如果以前有人问过这个问题。 我似乎能找到的唯一问题是那些询问如何通过onclick启动模式的问题。

Answer 1

问题是您的事件未与按钮绑定

请在这里找到JSFIDDLE

在您的HTML中-在script标签中执行以下操作

    <head> 
    <script> 

    function updatePassword(){

        console.log('updatePassword');

    }

    $(document).ready(function(){


       // $('.btn-primary').on('click',function(){ - This too works
         //   console.log('foo');     
        //});

         $('.btn-primary').on('click',updatePassword);


    });

</script>
</head>

未定义onclick返回函数

问题描述

1 个解决方案

解决方案1
1 已采纳 2015-01-10 12:11:26

未定义onclick返回函数

问题描述

1 个解决方案

解决方案1 1 已采纳 2015-01-10 12:11:26

解决方案1
1 已采纳 2015-01-10 12:11:26