用于计算的javascript函数

Question

I meet a trouble with a function. actually I need to make this function to perform a calculation on some text fields. When I worked on a single line no problems. But recently, someone asked to make a table with multiple lines (one line can be added dynamically) so, I do the following function so that it can not only duplicate line but id change all the fields concerned, so I add class to these fields. therefore I proceed as follows:

function clone(line) {

     newLine = line.cloneNode(true);
     line.parentNode.appendChild(newLine);
     var tab = document.getElementsByClassName('libelle_debours')
     var i = -1;
     while (tab[++i]) {
         tab[i].setAttribute("id", "_" + i);
     };
     var cab = document.getElementsByClassName('ht_no_tva')
     var j = -1;
     while (cab[++j]) {
         cab[j].setAttribute("id", "_" + j);
     };
     var dab = document.getElementsByClassName('ht_tva')
     var k = -1;
     while (dab[++k]) {
         dab[k].setAttribute("id", "_" + k);
     };
     var eab = document.getElementsByClassName('taux')
     var l = -1;
     while (eab[++l]) {
         eab[l].setAttribute("id", "_" + l);
     };
     var fab = document.getElementsByClassName('tva')
     var m = -1;
     while (fab[++m]) {
         fab[m].setAttribute("id", "_" + m);
     };

 }

 function delRow() {
     var current = window.event.srcElement;
     //here we will delete the line
     while ((current = current.parentElement) && current.tagName != "TR");
     current.parentElement.removeChild(current);
 }

The problem in fact is the second function that is used to make the calculation:

 function calcdebours() {
            var taux = document.getElementById('debours_taux_tva').value;
            var ht_no_tva = document.getElementById('debours_montant_ht_no_tva').value;
            var ht_tva = document.getElementById('debours_montant_ht_tva').value;
            var tva = Math.round((((ht_tva) * (taux)) / 100) * 100) / 100;;
            if (taux == '') {
                taux = 0;
            }
            if (ht_no_tva == '') {
                ht_no_tva = 0;
            }
            if (ht_tva == '') {
                ht_tva = 0;
            }
            document.getElementById('debours_montant_tva').value = tva;
            document.getElementById('debours_montant_ttc').value = (tva) + parseFloat(ht_tva) + parseFloat(ht_no_tva)


        }

        function 

montant_debours() {
        var ttc = document.getElementById('debours_montant_ttc').value;
        var ttc2 = document.getElementById('debours_montant_ttc2').value;
        if (ttc == '') {
            var ttc = 0;
        } else {
            var ttc = document.getElementById('debours_montant_ttc').value;
        }
        if (ttc2 == '') {
            var ttc2 = 0;
        } else {
            var ttc2 = document.getElementById('debours_montant_ttc2').value;
        }
        tx = parseFloat(ttc) + parseFloat(ttc2);
        document.getElementById('ttc_cheque').value = Math.round(tx * 100) / 100;
    }

As Id are not the same, do I have to create as many functions there are lines?

Is it possible to fit a single function to process each line?

If so can you tell me how?

Answer 1

If I'm not mistaken you can use for loop and append increment to the end of element's id. Like this:

trs = document.getElementById('container Id').getElementsByTagName('tr');
For (var i = 1, i <= trs.length; i++)
{
    var el = document.getElementById('debours_montant_ttc' + i);
}