Question

所以我想用我的网页做的就是输入我想要的数据，当我按下按钮时，e会在表格中添加一个新条目，并在表格中插入数据。

所以我拥有的东西：

<!DOCTYPE html>

<html>
<body>
<var>nome</var>
<var>num</var>
<var>marca</var>
<var>modelo</var>
<var>carregador</var>

<form action="chegada.txt">
Nome: <input type="text"  value=nome()><br>
Número: <input type="text" value=num()><br>
Marca: <input type="text" value=marca()><br>
Modelo: <input type="text" value=modelo()><br>
Carregador: <input type="text" value=carregador()><br>
</form>
<button onclick="novo()">Novo</button>
<style>
table, th, td {
    border: 1px solid black;
    border-collapse: collapse;
}
th, td {
    padding: 5px;
}
</style>
</head>
<body>

<table style="width:100%" id="chegada">
  <tr>
    <th>Nome</th>
    <th>Numero</th>
    <th>Marca</th>
<th>Modelo</th>
<th>carregador</th>
  </tr>
</table>
<br>

<script>
function novo() {
    var table = document.getElementById("chegada");
    var row = table.insertRow(0);
    var cell1 = row.insertCell(0);
    var cell2 = row.insertCell(1);
    var cell3 = row.insertCell(2);
    var cell4 = row.insertCell(3);
    var cell5 = row.insertCell(4);
    cell1.innerHTML = nome();
    cell2.innerHTML = numero();
    cell3.innerHTML = marca();
    cell4.innerHTML = modelo();
    cell5.iinerHTML = carregador();
}
</script>

</body>
</html>

除了“发布”表格中的数据之外，它会执行所有操作

Answer 1

使用此

<!DOCTYPE html>

<html>
<body>

<form action="chegada.txt">
Nome: <input type="text"  value="" id="val1"><br>
Número: <input type="text" value="" id="val2"><br>
Marca: <input type="text" value="" id="val3"><br>
Modelo: <input type="text" value="" id="val4"><br>
Carregador: <input type="text" value="" id="val5"><br>
</form>
<button onclick="novo()">Novo</button>
<style>
table, th, td {
    border: 1px solid black;
    border-collapse: collapse;
}
th, td {
    padding: 5px;
}
</style>
</head>
<body>

<table style="width:100%" id="chegada">
  <tr>
    <th>Nome</th>
    <th>Numero</th>
    <th>Marca</th>
<th>Modelo</th>
<th>carregador</th>
  </tr>
</table>
<br>

<script>
function novo() {
    var val1 = document.getElementById("val1").value;
    var val2 = document.getElementById("val2").value;
    var val3 = document.getElementById("val3").value;
    var val4 = document.getElementById("val4").value;
    var val5 = document.getElementById("val5").value;

    var prev=document.getElementById("chegada").innerHTML;
    document.getElementById("chegada").innerHTML=prev+"<tr><td>"+val1+"</td><td>"+val2+"</td><td>"+val3+"</td><td>"+val4+"</td><td>"+val5+"</td></tr>"

}
</script>

</body>
</html>

将表单条目保存到变量并添加到表

1 个答案: