jQuery在Javascript函数中不起作用

Question

这是场景

我有这个观点

<div class="modal fade " id="invoiceModal" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
    <div class="modal-dialog modal-lg">
        <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">Generate Invoice</h4>
            </div>
            <div class="modal-body">
                <section id="no-more-tables">
                    {!! Form::open(['url'=>'invoice/create', 'role'=>'form','class'=>'form-horizontal']) !!}
                        {!! Form::select('account_id', $accounts, null, ['id'=>'account_id', 'class'=>'form-control advance-selection', 'required']) !!}
                        {!! Form::select('prices', $prices, '', ['id'=>'item_prices','style'=>'display:none;']) !!}
                        {!! Form::select('packaging_type', $packaging_type, '', ['id'=>'packaging_type','style'=>'display:none;']) !!}
                            <table class="table table-bordered table-striped table-condensed cf">
                                <thead class="cf">
                                    <tr>
                                        <th>Item</th>
                                        <th>Packaging(Type)</th>
                                        <th>Quantity/Pack</th>
                                        <th>Quantity</th>
                                        <th>Packs</th>
                                        <th>Price</th>
                                        <th>Total</th>
                                    </tr>
                                </thead>
                                <tbody id="order_body">
                                </tbody>
                                <tbody>
                                    <tr>
                                        <td colspan="6" class="text-right">
                                            <strong>Total</strong>
                                        </td>
                                        <td><div class="input-group">
                                                {!! Form::input('number','total_price', null, ['id'=>'total_price', 'class'=>'form-control text-right','readonly']) !!}
                                            </div>
                                        </td>
                                    </tr>
                                    <tr>
                                        <td colspan="7" data-title="Actions">

                                            {!! Form::submit('Post',['class'=>'btn btn-primary btn-md button-next']) !!} &nbsp;

                                            <a href="javascript:void(0)" onclick="add_order_row()" class="btn btn-primary btn-md" id="add_more_btn">
                                                <i class="fa fa-plus"></i>
                                            </a>&nbsp;
                                            <a href="javascript:void(0)" onclick="remove_order_row()" class="btn btn-danger btn-md" id="remove_btn">
                                                <i class="fa fa-minus"></i>
                                            </a>

                                        </td>
                                    </tr>
                                </tbody>
                            </table>
                </section>
            </div>
            <div class="modal-footer">
                <button data-dismiss="modal" class="btn btn-default" type="button">Close</button>
            </div>
            {!! Form::close() !!}
        </div>
    </div>
</div>

这是我的Javascript代码与jQuery混合在一起

    <script>
        $('.advance-selection').css({'width':'100%'}).select2();
        var total_rows = 0;

        function get_inventory_dropdown(name, count) {

            if(name == 'item'){
            var str = '{!! Form::select('order[#count#][#name#]',$inventories, 0, ['id'=>'order_#count#_#name#', 'class'=>'form-control','placeholder' => 'Select an item','style'=>'width:100%','required']) !!}'; // Capital - Faizan Chugtai
            // $("#order_"+count+"_"+name+"").prop("selectedIndex", -1);
        }
            if(name == 'packaging_type'){
            var str = '{!! Form::select('order[#count#][#name#]', $packaging_type, 1, ['id'=>'order_#count#_#name#', 'class'=>'form-control','style'=>'width:100%','required']) !!}';
        }
            var count_reg = new RegExp('#count#','g');
            str = str.replace(count_reg,count);
            var name_reg = new RegExp('#name#','g');
            str = str.replace(name_reg,name);
            return str;
        }


        function get_text_field(name, count) {
            var str = '{!! Form::text('order[#count#][#name#]', '', ['id'=>'order_#count#_#name#', 'class'=>'form-control']) !!}'; //item

            if( name == 'quantity' ){
                str = '{!! Form::input('number', 'order[#count#][#name#]', '1', ['id'=>'order_#count#_#name#', 'class'=>'form-control', 'min'=>'1']) !!}';
            }
            if( name == 'packaging_type' ){
                str = '{!! Form::text('order[#count#][#name#]', '', ['id'=>'order_#count#_#name#', 'class'=>'form-control','required',]) !!}'
            }
            if( name == 'quantity_per_pack' ){
                str = '{!! Form::input('number', 'order[#count#][#name#]', '', ['id'=>'order_#count#_#name#', 'class'=>'form-control','min'=>'1','required',]) !!}';
            }
            if( name == 'packs' ){
                str = '{!! Form::input('number', 'order[#count#][#name#]', '', ['id'=>'order_#count#_#name#', 'class'=>'form-control', 'min'=>'1']) !!}';
            }
            if( name == 'price' ){
                str = '{!! Form::input('number', 'order[#count#][#name#]', '', ['id'=>'order_#count#_#name#', 'class'=>'form-control text-right','min'=>'0']) !!}';
            }
            if( name == 'total' ){
                str = '<div class="input-group">{!! Form::input('number', 'order[#count#][#name#]', '', ['id'=>'order_#count#_#name#', 'class'=>'form-control total-price-item text-right', 'readonly']) !!} </div>';
            }
            var count_reg = new RegExp('#count#','g');
            str = str.replace(count_reg,count);
            var name_reg = new RegExp('#name#','g');
            str = str.replace(name_reg,name);
            return str;

        }

        function assign_price(item) {
            var prices_list = $('#item_prices option');
            prices_list.each(function (i, e) {
                if(e.value == item.value)
                    $(item).closest('tr').find('td[data-title="Price"] input').val($(e).text());
            });
        }

        function calculate_total_price(field) {
            $('.alert').hide();
            if($(field).val() != 0){
                var qty = $(field).val();
                var price = $(field).closest('tr').find('td[data-title="Price"] input').val();
                $(field).closest('tr').find('td[data-title="Total"] input').val(price*qty);
            }else{
                $('.modal-body').prepend('<div class="alert alert-danger">Quantity can not be empty or zero!</div>');
            }
        }

        function update_grand_total() {
            var total_price = 0;
            $('.total-price-item').each(function(i, e){
                total_price += parseInt( $(e).val() );
            });

            $('#total_price').val(total_price);
        }


        function add_order_row() {
            var html = '<tr>' +
                    '<td data-title="Item">'+get_inventory_dropdown('item',total_rows)+'</td>' +
                    '<td data-title="Packaging(Type)">'+get_inventory_dropdown('packaging_type',total_rows)+'</td>' +
                    '<td data-title="Quantity/Pack">'+get_text_field('quantity_per_pack',total_rows)+'</td>' +
                    '<td data-title="Quantity">'+get_text_field('quantity', total_rows)+'</td>' +
                    '<td data-title="Quantity">'+get_text_field('packs', total_rows)+'</td>' +
                    '<td data-title="Price">'+get_text_field('price', total_rows)+'</td>' +
                    '<td data-title="Total">'+get_text_field('total', total_rows)+'</td>' +
                    '</tr>';

            $("#order_body").append(html);
            $('#order_'+total_rows+'_item').select2();
            $('#order_'+total_rows+'_packaging_type').select2();
            console.log('Hello');



            $('#order_'+total_rows+'_item').on('change',function(evt){
                assign_price(evt.target);
                // update_packaging_type(evt.target);

                calculate_total_price($(evt.target).closest('tr').find('td[data-title="Quantity"] input'));
                update_grand_total();
            });

            $('#order_'+total_rows+'_price').on('change', function(evt){
                calculate_total_price($(evt.target).closest('tr').find('td[data-title="Quantity"] input'));
                update_grand_total();
            });

            $('#order_'+total_rows+'_quantity').on('change blur input', function (evt) {
            calculate_total_price(evt.target);
                update_grand_total();                
            });


             $(document).on('keyup','#order_'+(total_rows)+'_quantity',function(){
                var packs =($('#order_'+(total_rows-1)+'_quantity').val() / $('#order_'+(total_rows-1)+'_quantity_per_pack').val());
                $('#order_'+(total_rows-1)+'_packs').val(packs);
            });


            $(document).on('keyup','#order_'+(total_rows)+'_packs',function(){
                var quantity =($('#order_'+(total_rows-1)+'_packs').val() * $('#order_'+(total_rows-1)+'_quantity_per_pack').val());
                $('#order_'+(total_rows-1)+'_quantity').val(quantity);
            });
            update_grand_total();
            total_rows++;

            if(total_rows == 200)
                $('#add_more_btn').hide();
        }


        function remove_order_row(){
            if(total_rows==1)
                return false;
            $('#order_body tr:last').remove();
            total_rows--;
        }
        add_order_row();

    </script>

这是我的网络应用程序的屏幕截图（我正在使用laravel 5.4）

当我单击“填充数量/包”和“数量”字段中的数据时，“包”字段也应相应更新，例如

如果数量/包是5，并且我要赠送5数量的物品，则包字段应显示我正在赠送1包。

反之亦然。

所以问题是当我单击加号按钮时，只有最后一行显示此行为，而它们上方的所有行都放弃了此功能。 我被困住了，请帮助我。

我不想将我的代码从javascript + jquery迁移到仅javascript代码或仅jquery代码，我想保留我的应用程序的这种结构。