Javascript 当使用Jquery模拟单击时，Jquery函数不起作用

我正在使用Opencart 2.3.0.2，我正在尝试将订单编辑页面的html更改为一个页面布局（默认情况下是带有引导选项卡）。 当您单击上一页上的按钮继续时，它似乎正在加载下一个选项卡的信息。 当我把它改为一页时，它不会加载上面的信息 document.ready，但单击按钮即可。 我有以下代码：

$('#button-refresh').on('click', function() {
  console.log('you've clicked button-refresh');
    $.ajax({
        url: '<?php echo $catalog; ?>index.php?route=api/cart/products&token=' + token + '&store_id=' + $('select[name=\'store_id\'] option:selected').val(),
        dataType: 'json',
        crossDomain: true,
        success: function(json) {
            $('.alert-danger, .text-danger').remove();

            // Check for errors
            if (json['error']) {
                if (json['error']['warning']) {
                    $('#content > .container-fluid').prepend('<div class="alert alert-danger"><i class="fa fa-exclamation-circle"></i> ' + json['error']['warning'] + ' <button type="button" class="close" data-dismiss="alert">&times;</button></div>');
                }

                if (json['error']['stock']) {
                    $('#content > .container-fluid').prepend('<div class="alert alert-danger"><i class="fa fa-exclamation-circle"></i> ' + json['error']['stock'] + '</div>');
                }

                if (json['error']['minimum']) {
                    for (i in json['error']['minimum']) {
                        $('#content > .container-fluid').prepend('<div class="alert alert-danger"><i class="fa fa-exclamation-circle"></i> ' + json['error']['minimum'][i] + ' <button type="button" class="close" data-dismiss="alert">&times;</button></div>');
                    }
                }
            }

            var shipping = false;

            html = '';
      console.log(json['products'].length);
            if (json['products'].length) {
                for (i = 0; i < json['products'].length; i++) {
                    product = json['products'][i];

                    html += '<tr>';
                    html += '  <td class="text-left">' + product['name'] + ' ' + (!product['stock'] ? '<span class="text-danger">***</span>' : '') + '<br />';
                    html += '  <input type="hidden" name="product[' + i + '][product_id]" value="' + product['product_id'] + '" />';

                    if (product['option']) {
                        for (j = 0; j < product['option'].length; j++) {
                            option = product['option'][j];

                            html += '  - <small>' + option['name'] + ': ' + option['value'] + '</small><br />';

                            if (option['type'] == 'select' || option['type'] == 'radio' || option['type'] == 'image') {
                                html += '<input type="hidden" name="product[' + i + '][option][' + option['product_option_id'] + ']" value="' + option['product_option_value_id'] + '" />';
                            }

                            if (option['type'] == 'checkbox') {
                                html += '<input type="hidden" name="product[' + i + '][option][' + option['product_option_id'] + '][]" value="' + option['product_option_value_id'] + '" />';
                            }

                            if (option['type'] == 'text' || option['type'] == 'textarea' || option['type'] == 'file' || option['type'] == 'date' || option['type'] == 'datetime' || option['type'] == 'time') {
                                html += '<input type="hidden" name="product[' + i + '][option][' + option['product_option_id'] + ']" value="' + option['value'] + '" />';
                            }
                        }
                    }

                    html += '</td>';
                    html += '  <td class="text-left">' + product['model'] + '</td>';
                    html += '  <td class="text-right"><div class="input-group btn-block" style="max-width: 200px;"><input type="text" name="product[' + i + '][quantity]" value="' + product['quantity'] + '" class="form-control" /><span class="input-group-btn"><button type="button" data-toggle="tooltip" title="<?php echo $button_refresh; ?>" data-loading-text="<?php echo $text_loading; ?>" class="btn btn-primary"><i class="fa fa-refresh"></i></button></span></div></td>';
                    html += '  <td class="text-right">' + product['price'] + '</td>';
                    html += '  <td class="text-right">' + product['total'] + '</td>';
                    html += '  <td class="text-center" style="width: 3px;"><button type="button" value="' + product['cart_id'] + '" data-toggle="tooltip" title="<?php echo $button_remove; ?>" data-loading-text="<?php echo $text_loading; ?>" class="btn btn-danger"><i class="fa fa-minus-circle"></i></button></td>';
                    html += '</tr>';

                    if (product['shipping'] != 0) {
                        shipping = true;
                    }
                }
            }

            if (!shipping) {
                $('select[name=\'shipping_method\'] option').removeAttr('selected');
                $('select[name=\'shipping_method\']').prop('disabled', true);
                $('#button-shipping-method').prop('disabled', true);
            } else {
                $('select[name=\'shipping_method\']').prop('disabled', false);
                $('#button-shipping-method').prop('disabled', false);
            }

            if (json['vouchers'].length) {
                for (i in json['vouchers']) {
                    voucher = json['vouchers'][i];

                    html += '<tr>';
                    html += '  <td class="text-left">' + voucher['description'];
                    html += '    <input type="hidden" name="voucher[' + i + '][code]" value="' + voucher['code'] + '" />';
                    html += '    <input type="hidden" name="voucher[' + i + '][description]" value="' + voucher['description'] + '" />';
                    html += '    <input type="hidden" name="voucher[' + i + '][from_name]" value="' + voucher['from_name'] + '" />';
                    html += '    <input type="hidden" name="voucher[' + i + '][from_email]" value="' + voucher['from_email'] + '" />';
                    html += '    <input type="hidden" name="voucher[' + i + '][to_name]" value="' + voucher['to_name'] + '" />';
                    html += '    <input type="hidden" name="voucher[' + i + '][to_email]" value="' + voucher['to_email'] + '" />';
                    html += '    <input type="hidden" name="voucher[' + i + '][voucher_theme_id]" value="' + voucher['voucher_theme_id'] + '" />';
                    html += '    <input type="hidden" name="voucher[' + i + '][message]" value="' + voucher['message'] + '" />';
                    html += '    <input type="hidden" name="voucher[' + i + '][amount]" value="' + voucher['amount'] + '" />';
                    html += '  </td>';
                    html += '  <td class="text-left"></td>';
                    html += '  <td class="text-right">1</td>';
                    html += '  <td class="text-right">' + voucher['price'] + '</td>';
                    html += '  <td class="text-right">' + voucher['price'] + '</td>';
                    html += '  <td class="text-center" style="width: 3px;"><button type="button" value="' + voucher['code'] + '" data-toggle="tooltip" title="<?php echo $button_remove; ?>" data-loading-text="<?php echo $text_loading; ?>" class="btn btn-danger"><i class="fa fa-minus-circle"></i></button></td>';
                    html += '</tr>';
                }
            }

            if (!json['products'].length && !json['vouchers'].length) {
                html += '<tr>';
                html += '  <td colspan="6" class="text-center"><?php echo $text_no_results; ?></td>';
                html += '</tr>';
            }

            $('#cart').html(html);

            // Totals
            html = '';

            if (json['products'].length) {
                for (i = 0; i < json['products'].length; i++) {
                    product = json['products'][i];

                    html += '<tr>';
                    html += '  <td class="text-left">' + product['name'] + ' ' + (!product['stock'] ? '<span class="text-danger">***</span>' : '') + '<br />';

                    if (product['option']) {
                        for (j = 0; j < product['option'].length; j++) {
                            option = product['option'][j];

                            html += '  - <small>' + option['name'] + ': ' + option['value'] + '</small><br />';
                        }
                    }

                    html += '  </td>';
                    html += '  <td class="text-left">' + product['model'] + '</td>';
                    html += '  <td class="text-right">' + product['quantity'] + '</td>';
                    html += '  <td class="text-right">' + product['price'] + '</td>';
                    html += '  <td class="text-right">' + product['total'] + '</td>';
                    html += '</tr>';
                }
            }

            if (json['vouchers'].length) {
                for (i in json['vouchers']) {
                    voucher = json['vouchers'][i];

                    html += '<tr>';
                    html += '  <td class="text-left">' + voucher['description'] + '</td>';
                    html += '  <td class="text-left"></td>';
                    html += '  <td class="text-right">1</td>';
                    html += '  <td class="text-right">' + voucher['amount'] + '</td>';
                    html += '  <td class="text-right">' + voucher['amount'] + '</td>';
                    html += '</tr>';
                }
            }

            if (json['totals'].length) {
                for (i in json['totals']) {
                    total = json['totals'][i];

                    html += '<tr>';
                    html += '  <td class="text-right" colspan="4">' + total['title'] + ':</td>';
                    html += '  <td class="text-right">' + total['text'] + '</td>';
                    html += '</tr>';
                }
            }

            if (!json['totals'].length && !json['products'].length && !json['vouchers'].length) {
                html += '<tr>';
                html += '  <td colspan="5" class="text-center"><?php echo $text_no_results; ?></td>';
                html += '</tr>';
            }

            $('#total').html(html);
        },
        error: function(xhr, ajaxOptions, thrownError) {
            alert(thrownError + "\r\n" + xhr.statusText + "\r\n" + xhr.responseText);
        }
    });
});

奇怪的是，当我在浏览器中单击按钮时，它工作正常，但当我尝试用jquery模拟单击时，它会给我错误。错误发生在我尝试console.log json['products']时。它说：

未捕获的TypeError:无法读取未定义的属性“length” 在Object.success（index.php？route=sale/order/edit&order_id=18&token=m0x3ptbrpokbabksiqr4jw4xndggbras:1002） 在j处（jquery-2.1.1.min.js:2） 在Object.fireWith[as resolveWith]（jquery-2.1.1.min.js:2） 在x（jquery-2.1.1.min.js:4） 在XMLHttpRequest。（jquery-2.1.1.min.js:4）

编辑： 更奇怪的是，按钮没有id=“button refresh”，但它不知怎么检测到了它。 按钮：

<button type="button" id="button-customer" data-loading-text="<?php echo $text_loading; ?>" class="btn btn-primary"><i class="fa fa-arrow-right"></i> <?php echo $button_continue; ?></button>

---

什么也没有发生。

尝试文档。单击下面的事件

$(document).ready(function() {
  $(document).on('click', "#button-refresh", function () {
    $(this).trigger('click');
  });
});

---

将按钮的

id

转换为按钮的

class

，并直接使用

$（文档）这将适用于已经存在的按钮以及动态添加的按钮。如果页面上的按钮是单一的，那么您可以使用
id
too您可以/应该重构您的代码，以便按钮单击只调用一个函数，然后您可以根据需要调用该函数，而不是“hack”一个按钮事件。@freedomn-m我编辑了我的问题并添加了按钮代码：）@freedomn-m警告说1Ok-错过了问题中最相关的部分：“当我在浏览器中单击按钮时效果很好，但当我尝试用jquery模拟单击时会出现错误。”
$(document).ready(function() {
  $('#button-customer').trigger('click');
});

$(document).ready(function() {
  $(document).on('click', "#button-refresh", function () {
    $(this).trigger('click');
  });
});