Question

我是JQuery的新手，我想用JQuery添加行表，但是当表没有行时，我的代码不会添加第一行（如果我已经有一行就可以了）。那么，我的代码出了什么问题？

jQuery(function () {
  var i = -1;
  $('input[name=barcode]').keydown(function(e) {
    var code = (e.keyCode ? e.keyCode : e.which);
    if(code==13) {
        var idx = i+1;
        var $this = $(this);
        var kode = $(".barcode").val();
        $.get('engine.php?kode='+kode+'&button=getDataBarang' , function(data) {
            var arrayObj = JSON.parse(data);
            var k=0; 
            var arr = [];
            $.each(arrayObj , function(key, value) {
                arr[k] = value;
                k++;
            });
            var newRow = $("<tr align='center'><td class='kode_barang'>" + $this.val() + "</td>" +
            "<td> "+arr[0]+" </td> <td> "+arr[1]+" </td> "+
            " <td><input class='harga' required type='text' name='harga["+(idx)+"]' size='10' maxlength='9' pattern='.{1,9}' value='"+arr[2]+"'> </td> <td class='stok'> "+arr[3]+" </td>"+
            " <td> <input class='jumlah' required type='text' name='jumlah["+(idx)+"]' size='3' maxlength='4' pattern='.{1,4}' value='1'> </td> "+
            "<td><input type='text' name='sub["+(idx)+"]' size='10' value='"+arr[2]+"' disabled></td>"+
            "<td><a href='#' class='remove'><font color='0404B4'>Batal</font></a></td>"+
            "<input type='hidden' name='kode[]' value='"+kode+"'></tr>");
            $('#tab > tbody > tr').eq(idx).after(newRow);
            alert(idx);
            //add total
            var total = 0;
            $('.harga').each(function () {
                var $this = $(this);
                var harga = parseInt($this.val());
                var index = $(this).prop('name').match(/\[(.*?)\]/)[1];
                var jumlah = $('input[name^=jumlah]').eq(index).val();
                $('input[name^=sub]').eq(index).val(jumlah*$(this).val());
                total += jumlah * harga;
            })
            $('.total').text(total);
            $('.barcode').val('');
        });
        return false;
    }
  });
});

Answer 1

目前尚不清楚你想要添加新行的确切位置，但是如果你想要做的就是解决在没有任何行时添加新行的问题，你可以改变这个：

$('#tab > tbody > tr').eq(idx).after(newRow);

到此：

var row = $('#tab > tbody > tr').eq(idx);
if (row.length) {
    row.after(newRow);
} else {
    $('#tab > tbody').append(newRow);
}

如果您总是想在表格的末尾添加一行，那么您可以随时使用：

$('#tab > tbody').append(newRow);

JQuery不会添加第一行

1 个答案: