Fügen Sie dynamisch eine Tabelle im form/div-Tag hinzu
P粉127901279
P粉127901279 2023-09-13 23:18:44
0
1
558

Dynamisch erstellte Tabellen werden außerhalb von div-Tags angezeigt.

Ich erstelle ein responsives Registrierungsformular. Das Eingabefeld nimmt die vom Benutzer angegebene erforderliche Anzahl von Zeilen für die Tabelle und erstellt die erforderliche Anzahl von Zeilen mit einer festen Anzahl von Spalten.

Ich habe die Tabelle erstellt, aber sie erscheint nicht an der gewünschten Stelle. Bitte geben Sie mir einen Rat. Hilft auch bei der Beschriftungsfrage in der ersten Zeile, dem Titel (th).

function createFamTable() { var rows = document.getElementById("family-rows").value; var tbl = document.createElement("table"); tbl.id = "family-table1"; var tblBody = document.createElement("tbody"); for (let i = 0; i < rows; i++) { var row = document.createElement("tr"); for (let j = 0; j < 5; j++) { var cell = document.createElement("td"); switch(j) { case j=0: var cellText = document.createElement('input'); cellText.placeholder = "Enter Name"; cell.appendChild(cellText); break; case j=1: var cellText = document.createElement('input'); cellText.placeholder = "Enter Relation"; cell.appendChild(cellText); break; case j=2: var cellText = document.createElement('input'); cellText.placeholder = "Enter Profession"; cell.appendChild(cellText); break; case j=3: var cellText = document.createElement('input'); cellText.placeholder = "Enter Age"; cell.appendChild(cellText); break; case j=4: var cellText = document.createElement('select'); var arr = ["Select Yes / No","Yes","No"]; for (var k=0;k<=2;k++){ var opt = document.createElement('option'); opt.value = arr[k]; opt.text = arr[k]; cellText.appendChild(opt); } cell.appendChild(cellText); break; } row.appendChild(cell); } tblBody.appendChild(row); } tbl.appendChild(tblBody); document.body.appendChild(tbl); cell.setAttribute("border", "2"); addFirstRow(); }
Family Details
Back

Ich möchte, dass die Tabelle innerhalb des div-Tags (in diesem leeren Bereich) erscheint.

Ich habe auch versucht, der Tabelle einen Etikettentitel hinzuzufügen. Bitte helfen Sie auch, dieses Problem zu lösen.

P粉127901279
P粉127901279

Antworte allen (1)
P粉644981029

你做得很好;只是一些矿工的错误。为“添加详细信息”按钮添加一个属性(type="button");默认情况下,表单中的按钮类型是提交,添加属性如下:

并在任意位置添加一个 div

还有这个

document.body.appendChild(tbl);

替换为

document.getElementById('form-table').appendChild(tbl);

document.getElementById('form-table').innerHTML = tbl;
    Neueste Downloads
    Mehr>
    Web-Effekte
    Quellcode der Website
    Website-Materialien
    Frontend-Vorlage
    Über uns Haftungsausschluss Sitemap
    Chinesische PHP-Website:Online-PHP-Schulung für das Gemeinwohl,Helfen Sie PHP-Lernenden, sich schnell weiterzuentwickeln!