Daugiau
Pridėti lentelės eilutę jQuery
Koks yra geriausias jQuery metodas, norint į lentelę pridėti papildomą eilutę kaip paskutinę eilutę?
Ar tai priimtina?
$('#myTable').append('<tr><td>my data</td><td>more data</td></tr>');
Ar yra apribojimų, ką galima įtraukti į tokią lentelę (pvz., įvestys, pasirinkimai, eilučių skaičius)?
2320
3
Jūsų siūlomas metodas negarantuoja, kad gausite norimą rezultatą, pavyzdžiui, kas būtų, jei turėtumėte
tbody
:Gautumėte tokį rezultatą:
Todėl rekomenduočiau rinktis šį metodą:
Į
after()
metodą galite įtraukti bet ką, jei tai yra galiojantis HTML, įskaitant kelias eilutes, kaip nurodyta pirmiau pateiktame pavyzdyje.Atnaujinta: Peržiūrime šį atsakymą po pastarojo meto veiklos, susijusios su šiuo klausimu. eyelidlessness pateikia gerą pastabą, kad DOM visada bus
tbody
; tai tiesa, bet tik tuo atveju, jei yra bent viena eilutė. Jei eilučių nėra, nebus irtbody
, nebent jūs patys jį nurodėte.DaRKoN_ siūlo pridėti prie
tbody
, o ne pridėti turinį po paskutinėstr
. Taip išsprendžiama eilučių nebuvimo problema, tačiau tai vis tiek nėra neperšaunama, nes teoriškai galite turėti kelistbody
elementus ir eilutė bus pridėta prie kiekvieno iš jų.Viską pasvėrus, nesu tikras, kad yra vienintelis vienos eilutės sprendimas, kuris atitiktų visus įmanomus scenarijus. Turėsite įsitikinti, kad jQuery kodas atitinka jūsų žymėjimą.
Manau, kad saugiausias sprendimas tikriausiai būtų užtikrinti, kad jūsų
table
visada apimtų bent vienątbody
, net jei ji neturi eilučių. Remdamiesi tuo, galite naudoti toliau nurodytą metodą, kuris veiks nepriklausomai nuo to, kiek eilučių turite (ir taip pat atsižvelgs į kelistbody
elementus):Ką daryti, jei turėtumėte
<tbody>
ir<tfoot>
?pvz:
Tada nauja eilutė būtų įterpta į poraštę, o ne į pagrindinę eilutę.
Taigi geriausias sprendimas - įtraukti
<tbody>
žymą ir naudoti.append
, o ne.after
.Galite naudoti šią puikią jQuery add table row funkciją. Ji puikiai veikia su lentelėmis, kurios turi
<tbody>
ir kurios neturi. Be to, ji atsižvelgia į paskutinės lentelės eilutės colspan.Pateikiame naudojimo pavyzdį: