Question

我正在使用jQuery和AJAX向表中添加行。我在函数中有以下代码。

var fila='<tr>';
fila+='<td><select id="listaPagares'+cantFilas+'"></select></td>'; //Keep this in mind
fila+='<td><select id="listaCuotas'+cantFilas+'"></select></td>';
fila+='<td><input type="text" name="valor'+cantFilas+'" id=”valor'+cantFilas+'" /></td>';
fila+='<td id="desc'+cantFilas+'"></td>';
fila+='<td id=”total'+cantFilas+'"></td>';
fila+='</tr>';
$('#lineaDetalle tbody').append(fila);

在此之后，我做了一个AJAX请求。这个相同的请求在另一个表中使用，所以我非常确定搜索工作的XML标记。请参阅上面的“listaPagares [i]”选择行？在同一个函数中，下面的一些行，我这样做，在AJAX请求的成功部分。

$(xml).find('data').each(function()
{
    var errmsg = $(this).find('rowsfound').text();
    if(errmsg!='yes')
    {
        if(errmsg=='no')
        {
            $('#error').text('No se encontraron pagarés.');
        }
        else
        {
            $('#error').text('Rut del alumno o del apoderado erróneos.');
        }
        $('#errmsg').show(500);
    }
    else
    {
        $(this).find('pagare').each(function()
        {
            $('#listaPagares'+cantFilas).append('<option value="'+$(this).find('numpagare').text()+'-'+$(this).find('rbd').text()+'">PAGARÉ N° '+$(this).find('numpagare').text()+' '+$(this).find('nomcolegio').text()+'</option>');
        });
    }
});

但是，当我按下添加新行的按钮时，第二个追加添加选项的选项不起作用。我也很确定该程序是通过该行，我在它之前添加了一个警报并显示。什么可能是ẃrong？提前谢谢。

编辑：我在成功条款中添加了整个过程，因此您可以看到我使用“this”的原因。

Answer 1

您不能在$(this)内使用append()。另外，您错过了#中的.或find()：

... $(this).find('numpagare') ... // `#numpagare` or `.numpagare`

首先缓存您的选择器，然后执行此操作：

var $el = $('#listaPagares' + cantFilas),
    numPagare = $el.find('.numpagare').text(),
    nomColegio = $el.find('.nomcolegio').text(),
    rbd = $el.find('.rbd').text(),
    html = '<option value="' + numPagare + '-' + rbd + '">' +
            'PAGARÉ N° ' + numPagare + ' ' + nomColegio + 
            '</option>';

$el.append(html);

看起来不是很好吗？

Answer 2

我的解决方案如下：

我宣布了一个全局数组，其中包含我想在任何事情之前添加的“cuotas”。所以，这会发生：

$('#pagares').change(function()
{
    $('#errmsg').append(cargaAjax);
    return encPagos();
    $('#errmsg:last-child').remove();
});

在encPagos中会发生这种情况：

$('#pagosHechos table tbody').empty();
arrCuotas=[];
$(this).find('pagos').each(function()
{
    $(this).find('pago').each(function()
    {
        $('#pagosHechos table tbody').append('<tr><td>'+$(this).find('concepto').text()+'</td><td>'+$(this).find('valor').text()+'</td><td>'+$(this).find('pagado').text()+'</td><td>'+$(this).find('dif').text()+'</td><td>'+$(this).find('fvenc').text()+'</td></tr>');
        arrCuotas.push($(this).find('concepto').text());    
    });
});

所以，每当我添加一行时，我只需要这样做：

var fila='<tr>';
fila+='<td><select id="listaCuotas'+cantFilas+'" name="listaCuotas'+cantFilas+'">';
for(i=0;i<arrCuotas.length;i++)
{
    fila+='<option value="'+(i+1)+'">'+arrCuotas[i]+'</option>';
}
fila+='</select></td>';
fila+='<td><input type="text" name="valor'+cantFilas+'" id="valor'+cantFilas+'" /></td>';
fila+='<td id="desc'+cantFilas+'">'+desc+'%</td>';
fila+='<td id="total'+cantFilas+'"></td>';
fila+='</tr>'

无法使用jQuery附加到附加元素

2 个答案: