Как убедиться, что функция вывода j-запроса работает после клонирования

клонировать и вычислять код, хорошо работающий с первым разделом, но вычислять остановки кода для клонированной формы

// CODE OF CLONE FOR TRANSFERS
var gentransferid = 2;
$(".add-row-transfer").click(function() {
var $clone = $("ul.transfer-details").first().clone();
var $input = $clone.find('#transferid');
$input.val(gentransferid).attr('gentransferid', +gentransferid)

$clone.find('#transfer_sale').val('');
$clone.find('#transfer_cost').val('');
$clone.find('#transfer_profit').val('');

$clone.append("<button type='button' class='remove-row-transfer'>-</button>");
$clone.insertBefore(".add-row-transfer");
gentransferid++;
});
// CODE OF REMOVE CLONE FOR TRANSFERS
$(".cloned-removed-div-transfer").on("click", ".remove-row-transfer", function() {
$(this).parent().remove();
gentransferid--;
});

$(document).on('change', '.transfer_cost', function() {
$(".transfer_profit").val((parseFloat($(".transfer_sale").val()) - parseFloat($(".transfer_cost").val())));
});

$(document).on('change', '.transfer_sale', function() {
$(".transfer_profit").val((parseFloat($(".transfer_sale").val()) - parseFloat($(".transfer_cost").val())));
});

jsfiddle

кстати как отдыхать выпадающий список при клонировании

Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
В JavaScript одним из самых запутанных понятий является поведение ключевого слова "this" в стрелочной и обычной функциях.
Концепция локализации и ее применение в приложениях React ⚡️
Концепция локализации и ее применение в приложениях React ⚡️
Локализация - это процесс адаптации приложения к различным языкам и культурным требованиям. Это позволяет пользователям получить опыт, соответствующий...
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
В настоящее время производительность загрузки веб-сайта имеет решающее значение не только для удобства пользователей, но и для ранжирования в...
Безумие обратных вызовов в javascript [JS]
Безумие обратных вызовов в javascript [JS]
Здравствуйте! Юный падаван 🚀. Присоединяйся ко мне, чтобы разобраться в одной из самых запутанных концепций, когда вы начинаете изучать мир...
Система управления парковками с использованием HTML, CSS и JavaScript
Система управления парковками с использованием HTML, CSS и JavaScript
Веб-сайт по управлению парковками был создан с использованием HTML, CSS и JavaScript. Это простой сайт, ничего вычурного. Основная цель -...
JavaScript Вопросы с множественным выбором и ответы
JavaScript Вопросы с множественным выбором и ответы
Если вы ищете платформу, которая предоставляет вам бесплатный тест JavaScript MCQ (Multiple Choice Questions With Answers) для оценки ваших знаний,...
0
0
41
1

Ответы 1

Пожалуйста, попробуйте это:

    $(document).ready(function() {

            $("#btnAddNew").click(function (e) {
                e.preventDefault();
                var $tableBody = $("#systable");
                var $trLast = $tableBody.find("tr:last");
                var $trNew = $trLast.clone();
                var suffix = $trNew.find(':input:first').attr('name').match(/\d+/);
                $trNew.find("td:last").html('<a href = "#" class = "remove" >Remove</a>');
                $.each($trNew.find(':input'), function (i, val) {
                    // Replaced Name
                    var oldN = $(this).attr('name');
                    var newN = oldN.replace('_' + suffix , '_' + (parseInt(suffix) + 1) );
                    $(this).attr('name', newN);
                    $(this).attr('id', newN);


                });
                $trLast.after($trNew);
            });

            // 2. Remove
            $(document).on('click', 'a.remove', function (e) {
                e.preventDefault();
                $(this).parent().parent().remove();
            });

            $(document).on("blur", ".transfer_sale_css", function () {

                CalculateDifference();
            });


            $(document).on("blur", ".transfer_cost_css", function () {

                CalculateDifference();
            });



            $(document).on("blur", ".transfer_profit_css", function () {

                CalculateDifference();
            });


           /*$("#transfer_sale_0").blur(function () {
               CalculateDifference();
           })

            $("#transfer_cost_0").blur(function () {
                CalculateDifference();
            })

            $("#transfer_profit_0").blur(function () {
                CalculateDifference();
            })*/


            function CalculateDifference() {

               var transfer_sale=[],transfer_cost=[],transfer_profit=[];
                var i = 0;

                $('#systable tr td:nth-child(2)').each(function () {
                    if (i == 0) {
                        transfer_sale[i] = $(this).find('input[type = "text"]').val();

                    }
                    else {
                        transfer_sale[i]= "," + $(this).find('input[type = "text"]').val();
                    }
                    i++;
                });

                i = 0;

                $('#systable tr td:nth-child(3)').each(function () {
                    if (i == 0) {
                        transfer_cost[i] = $(this).find('input[type = "text"]').val();

                    }
                    else {
                        transfer_cost[i]= "," + $(this).find('input[type = "text"]').val();
                    }
                    i++;
                });


                i = 0;

                $('#systable tr td:nth-child(4)').each(function () {
                    if (i == 0) {
                        transfer_profit[i] = $(this).find('input[type = "text"]').val();

                    }
                    else {
                        transfer_profit[i]= "," + $(this).find('input[type = "text"]').val();
                    }
                    i++;
                });


                for(i=0;i<=transfer_profit.length-1;i++) {
                    var transfer_sale_val = parseFloat($("#transfersale_"+i.toString()).val());
                    var transfer_cost_val = parseFloat($("#transfercost_"+i.toString()).val());

                    var transfer_profit_val = transfer_sale_val - transfer_cost_val;

                    $("#transferprofit_"+ i.toString()).val(transfer_profit_val);
                }
                    //alert(transfer_sale);
                    //alert(transfer_cost);
                    //alert(transfer_profit);

            }
        });
<script src = "https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div>
    <form>
        <table align = "center" id = "systable">
            <tr>
                <td>
                    <select name = "dropdown_0">
                        <option>1</option>
                        <option>2</option>
                        <option>3</option>
                        <option>4</option>
                    </select>
                </td><td>
                    <input type = "text" id = "transfersale_0" name = "transfersale_0" class = "transfer_sale_css" >
            </td>
                <td>
                    <input type = "text" id = "transfercost_0" name = "transfercost_0" class = "transfer_cost_css">
                </td>
                <td>
                    <input type = "text" id = "transferprofit_0" name = "transferprofit_0" class = "transfer_profit_css">
                </td>
                <td></td>
            </tr>
        </table>
        <table align = "center">
        <tr>
            <td>
            <button type = "button" id = "btnAddNew" class = "add-row-transfer" >+ New Car</button></td>
        </tr>
        </table>
    </form>
</div>

Другие вопросы по теме