jquery implementiert die Methode zum Hinzufügen und Löschen von rows_jquery

Das Beispiel in diesem Artikel beschreibt die Methode zum Hinzufügen und Löschen von Zeilen in JQuery. Teilen Sie es als Referenz mit allen. Die spezifische Analyse lautet wie folgt:

Ich habe kürzlich ein Abstimmungsverwaltungsmodul erstellt und musste Fragenoptionen hinzufügen. Der Einfachheit halber habe ich einfach das Hinzufügen und Löschen von Tabellenzeilen implementiert.

Hinweis: jquery.js muss eingeführt werden

Zuerst das Rendern: (Das Formular enthält standardmäßig 4 Zeilen)

Formularcode:

Code kopieren Der Code lautet wie folgt:

 
     
          
             
             
             
         
          
             
             
             
         
          
             
             
             
         
          
             
             
             
         
          
             
             
             
         
   

所属问题                  (单选)                  (复选):	${question}
选项1:
选项2:
选项3:
选项4:

 
   

 
                                                                                                                                                                                                                        

JS-Code:

Code kopieren Der Code lautet wie folgt: var rowCount=4; //Die Standardanzahl der Zeilen beträgt 4 Zeilen

//Zeile
hinzufügen Funktion addRow(){
rowCount ;
var newRow='Option ' rowCount ':Delete< / a>'; $('#optionContainer').append(newRow);
}

//Zeile
löschen Funktion delRow(rowIndex){
$("#option" rowIndex).remove();
rowCount--;
}


Es ist zu beachten, dass die ID im des Formulars definiert werden muss Definieren Sie beim Hinzufügen einer Zeile eine neue Zeilen-ID.

Eine Zeilenanzahlvariable muss in JS definiert werden, da mein Formular standardmäßig 4 Zeilen hat (die erste Zeile, d. h. die Zeile mit id='option0' kann ignoriert werden), sodass der in JS definierte rowCount standardmäßig 4 ist .

Okay, fertig. So einfach ist das.

Wenn Sie außerdem an einer bestimmten Position eine Zeile hinzufügen müssen, müssen Sie so schreiben

Code kopieren Der Code lautet wie folgt:$("#tab tr").eq(-2). after(" Schlüsselwortname: < /td> *");

-2 dient zum Hinzufügen einer Zeile nach dem vorletzten Tr.

tab ist die ID der Tabelle

Ich hoffe, dass dieser Artikel für alle bei der jQuery-Programmierung hilfreich sein wird.