如何在表中自动添加信息

Question

我有三个对话框，一个用于输入名字，输入姓氏，并输入点。我试图让程序会自动把我投入在新表中同一页上。所以，当我输入程序名程序自动把名字表，同为名称和点。而在我的表列有“要求”。如果用户输入他有更多的列然后35点“要求，”需要程序自动打印“YES”，或者如果他有较低的35个程序需要打印“NO”

这里是我开始，我做桌子，三个输入对话框，但是这件事情与自动打印和检查点不会非常好：

<form>
 Name: <input type="text" id="name"/><br/>
 Last name: <input type="text" id="last"/><br/>
 Points: <input type="number" id="age"/><br/>
 <button type="submit">Submit</button><br></form>
 <div id="a"></div>
 </form>

<table>
<style>
table {
border-collapse: collapse;
width: 100%;
}

th, td {
text-align: left;
padding: 8px;
}

tr:nth-child(even){background-color: #f2f2f2}

th {
background-color: #4CAF50;
color: white;
}
</style>
<tr>
<th>Name</th>
<th>Last name</th>
<th>Points</th>
<th>Requirements</th>
</tr>

我试着用：

$("th i ").click(function () {
var index = $(this).parent().index();
$("tr").each(function () {
$(this).find("input").val($(this).find("td:eq(" + index + ") input").val());
$(this).find("select").val($(this).find("td:eq(" + index + ") 
select").val())
})
})

Answer 1

做完这个最好的办法是从.js文件...让一个.js文件并将其包含在与<script src="name.js" type="module"></script> HTML

在这种name.js文件，你需要找到与querySelector或...的getElementById例如你的元素：

const inputName=document.getElementById("name");
const inputLast=document.getElementById("last");
const inputPts=document.getElementById("age");
const buttonName=documen.getElementById("btn");

buttonName.onclick=(ev)=>createTable(ev.target);

function createTable(buttonName)
{

const getTable=document.querySelector("table");
//create table here <trow><th>...</th></trow>
//create table here <trow><td>...</td></trow>

//find a div with id="a" 

const getDiv=document.getElementById("a");
if(inputPts.value>35)
{
getDiv.innerHTML="YES";
}
else
{
getDiv.innerHTML="NO";
}

}