javascript - JQuery 未捕获错误 : cannot call methods on button prior to initialization; attempted to call method 'loading'

标签 javascript jquery twitter-bootstrap

有人可以解释一下这个控制台错误以及如何修复它吗?

Uncaught Error: cannot call methods on button prior to initialization; attempted to call method 'loading'

当单击“添加到购物车”按钮并在 Chrome 开发人员工具中查看控制台时,这是发生这种情况的页面: http://tinyurl.com/pqb7wyr

购物车按钮:

<button type="button" id="button-cart" data-loading-text="Loading..." class="btn btn-outline-inverse">Add to Cart</button>

Javascript:

<script type="text/javascript"><!--
$('#button-cart').on('click', function() {
$.ajax({
    url: 'index.php?route=checkout/cart/add',
    type: 'post',
    data: $('#product input[type=\'text\'], #product input[type=\'hidden\'], #product input[type=\'radio\']:checked, #product input[type=\'checkbox\']:checked, #product select, #product textarea'),
    dataType: 'json',
    beforeSend: function() {
        $('#button-cart').button('loading');
    },
    complete: function() {
        $('#button-cart').button('reset');
    },
    success: function(json) {
        $('.alert, .text-danger').remove();
        $('.form-group').removeClass('has-error');

        if (json['error']) {
            if (json['error']['option']) {
                for (i in json['error']['option']) {
                    var element = $('#input-option' + i.replace('_', '-'));

                    if (element.parent().hasClass('input-group')) {
                        element.parent().after('<div class="text-danger">' + json['error']['option'][i] + '</div>');
                    } else {
                        element.after('<div class="text-danger">' + json['error']['option'][i] + '</div>');
                    }
                }
            }

            if (json['error']['recurring']) {
                $('select[name=\'recurring_id\']').after('<div class="text-danger">' + json['error']['recurring'] + '</div>');
            }

            // Highlight any found errors
            $('.text-danger').parent().addClass('has-error');
        }

        if (json['success']) {
            $('#notification').html('<div class="alert alert-success">' + json['success'] + '<button type="button" class="close" data-dismiss="alert">&times;</button></div>');

            $('#cart-total').html(json['total']);

            $('html, body').animate({ scrollTop: 0 }, 'slow');

            $('#cart > ul').load('index.php?route=common/cart/info ul li');
        }
    }
});
});
//--></script>

我读到我应该在所有 jquery 和 jquery 插件 js 之后重新排序脚本以加载 boostrap js 来解决该错误,但这并没有解决它。

最佳答案

对我来说,它是通过将 jquery-ui.min.js 文件放在 bootstrap.js 之前修复的

只需在收到错误的页面上单击 ctrl+u 并 checkin <head>如果在 bootstrap.js 之后调用 jquery-ui 文件的部分 这可能是错误的原因。

在调用 bootstrap.js 之前放置 jquery-ui 将解决该问题。

关于javascript - JQuery 未捕获错误 : cannot call methods on button prior to initialization; attempted to call method 'loading' ,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/31506671/

相关文章:

javascript - 如何将现有网站更改为 Bootstrap

javascript - 分析器条动画 HTML 音频 API 不起作用

javascript - 什么决定了从 Object.getOwnPropertySymbols 返回的符号的顺序?

jquery - 如何使用 bootstrap 或 jquery 在按钮单击时将部分 View 显示为弹出/模式?

jquery - 在 Grails 中使用 Twitter bootstrap,看起来不一样

javascript - 在 DataTables 中切换列后设置以前的列宽

javascript - typescript 与 JSX

jquery - 无法序列化对象 - jquery.param 返回未定义

javascript - 使用 Ajax 附加到 Jade 中的下拉列表

javascript - Bootstrap 工具提示正在初始化但未显示