如果在加载DOM之后创建行,则计算表中的行数

时间:2013-10-29 00:44:46

标签: javascript jquery events

我在加载DOM后创建行,但我想知道如何计算行数以消除最后一行。

我有这个。

<script type="text/javascript">//Procesamiento del formulario.
    $(document).ready(function(){
        var cuentaTr = $('#elementos >tbody >tr').length - 1; //Cuenta el número de filas que tiene la tabla originalmente, es 1.
        $('#agregar').click(function(){ //Clic en el botón que agrega nueva fila.
            cuentaTr++; //Es el número de fila que le corresponde a cada una que se crea.
            var nume = $('#elementos >tbody >tr >td').length; //Obtener el número de celdas
            var capa = document.getElementById("elementos"); //Obtener el elemento con el id elementos
            var tr = ("tr"); //Crear una tag tr
            capa.appendChild(tr); //Agregar la tag al elemento con id elementos.

            var nuevaLetra = "A"; //La variable con la que se le asigna una letra a cada columna.
            for (var i = 1; i <= nume; i++) {
                    $('<td><input type="text" class="prueba" id="'+nuevaLetra+cuentaTr+'" name="columna'+nuevaLetra+cuentaTr+'" required/></td>').appendTo('#elementos'); //Creación de nuevo input. THIS IS THE IMPORTANT!
                    var ASCII = nuevaLetra.charCodeAt(); //Obtener código ASCII
                    var aumento = ((ASCII+1 >= 65 && ASCII+1 <= 90) || (ASCII+1 >= 97 && ASCII+1 <= 122)) ? ASCII+1 : ASCII; //Incremenar la letra
                    var nuevaLetra = String.fromCharCode(aumento); //Tranformar el código a letra.
            };


            if (cuentaTr == 2){
                $('<button type="button" id="eliminame">-</button>').insertAfter('#agregar'); //Creación del botón de eliminación de filas
                };
            });

        $(document).on('click', '#eliminame', function(){ //Función que elimina las filas HERE IS MY DUDE.  
            $('#elementos tbody tr:last').remove(); //I WANT TO REMOVE THE LAST ROW. THIS CODE ELIMINATE ONLY THE ROWS CREATE WHEN DOM LOADED.
            cuentaTr--;
            if (cuentaTr == 1) {
                $(this).remove();
            };
            });



        });


 </script>

我能做些什么?

谢谢! 对不起我的英语。我不会说英语。

2 个答案:

答案 0 :(得分:0)

var cuentaTr = $('#elementos >tbody >tr').length - 1;(已在您的代码中)应该为您提供行数(减1)。也许做一个jsfiddle所以我们可以调试发生了什么?

答案 1 :(得分:0)

看起来如何将tr附加到表中有一些问题,请尝试

 $(document).ready(function () {
     var cuentaTr = $('#elementos >tbody >tr').length - 1; //Cuenta el número de filas que tiene la tabla originalmente, es 1.
     $('#agregar').click(function () { //Clic en el botón que agrega nueva fila.
         cuentaTr++; //Es el número de fila que le corresponde a cada una que se crea.
         var nume = $('#elementos >tbody >tr:first >td').length; //Obtener el número de celdas
         var capa = $("#elementos"); //Obtener el elemento con el id elementos
         var tr =  $('#tr').appendChild(tr); //Agregar la tag al elemento con id elementos.

         var nuevaLetra = "A"; //La variable con la que se le asigna una letra a cada columna.
         for (var i = 1; i <= nume; i++) {
             $('<td><input type="text" class="prueba" id="' + nuevaLetra + cuentaTr + '" name="columna' + nuevaLetra + cuentaTr + '" required/></td>').appendTo(tr); //Creación de nuevo input. THIS IS THE IMPORTANT!
             var ASCII = nuevaLetra.charCodeAt(); //Obtener código ASCII
             var aumento = ((ASCII + 1 >= 65 && ASCII + 1 <= 90) || (ASCII + 1 >= 97 && ASCII + 1 <= 122)) ? ASCII + 1 : ASCII; //Incremenar la letra
             var nuevaLetra = String.fromCharCode(aumento); //Tranformar el código a letra.
         };


         if (cuentaTr == 2) {
             $('<button type="button" id="eliminame">-</button>').insertAfter('#agregar'); //Creación del botón de eliminación de filas
         };
     });

     $(document).on('click', '#eliminame', function () { //Función que elimina las filas HERE IS MY DUDE.  
         $('#elementos tbody tr:last').remove(); //I WANT TO REMOVE THE LAST ROW. THIS CODE ELIMINATE ONLY THE ROWS CREATE WHEN DOM LOADED.
         cuentaTr--;
         if (cuentaTr == 1) {
             $(this).remove();
         };
     });



 });