我想知道我的代码是否正确,在用户给出 AGE<18 时,我想要后,点击按钮消失了



我试着这样做:用HTML和JavaScript创建一个网页。在你的名字会出现的网站上。·在表格中填写学生对象。·这些对象有3个字段(全名,年龄,amka)。这些对象的创建将使用构造函数完成(注意fullname字段是名称,并按如下方式给出:"名-姓"·直到对象未满18岁时才被填满的表格。注意该节点不会被插入到表中。

<!DOCTYPE html>
<html lang="en">
<script>



function createPerson() {
var fullname = document.getElementById('inputValueFullname').value;
var age = document.getElementById('inputValueAge').value;
var amka = document.getElementById('inputValueAmka').value;

function person(fullname, age, amka) {
this.fullname = fullname;
this.age = age;
this.amka = amka;
}
var myArray = [];
var NewPerson = new person(fullname, age, amka);
if(age && age>= 18 && fullname && amka){

myArray.push(NewPerson)
} else {


}

console.log(NewPerson);
}
</script>


<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>

<label>Fullname: <input type="text" id="inputValueFullname"></label>
<label>Age:<input type="text" id="inputValueAge"></label>
<label>Amka:<input type="text" id="inputValueAmka"></label>
<button type="button" onclick=" createPerson();">Add</button>

<table id="table">
<thead>
<tr>
<th>Name/Surname</th>
<th>Age</th>
<th>AMKA</th><br><br><br><br><br>
</tr>
</thead>
</table>
</body>
</html>

首先,我假设AMKA是一个识别号码,因为当我试图搜索它是关于什么的时候,我得到的唯一结果是一个公司或希腊公民ID。将数据打印到表格的JavaScript函数可以不使用任何数组。

<script>
function publishToTable() {
const fullname = document.getElementById('fullname').value;
const age = document.getElementById('age').value;
const amka = document.getElementById('amka').value;
const error = document.getElementById('error');
if (age && age>= 18 && fullname && amka) {
const tableElement = document.getElementById('table');
const trElement = document.createElement('tr');
const tbodyElement = document.createElement('tbody');
const fullnameEle = document.createElement('td');
const ageEle = document.createElement('td');
const amkaEle = document.createElement('td');
fullnameEle.innerHTML = fullname;
ageEle.innerHTML = age;
amkaEle.innerHTML = amka;
trElement.appendChild(fullnameEle);
trElement.appendChild(ageEle);
trElement.appendChild(amkaEle);
tbodyElement.appendChild(trElement);
tableElement.appendChild(tbodyElement);
}
}
</script>

我想我解决了你的问题:js_issue_solved.html

完整代码:

// <!DOCTYPE html>
<html lang="en">
<script>
function publishToTable() {
const fullname = document.getElementById('fullname').value;
const age = document.getElementById('age').value;
const amka = document.getElementById('amka').value;
const error = document.getElementById('error');
if (age && age>= 18 && fullname && amka) {
const tableElement = document.getElementById('table');
const trElement = document.createElement('tr');
const tbodyElement = document.createElement('tbody');
const fullnameEle = document.createElement('td');
const ageEle = document.createElement('td');
const amkaEle = document.createElement('td');
fullnameEle.innerHTML = fullname;
ageEle.innerHTML = age;
amkaEle.innerHTML = amka;
trElement.appendChild(fullnameEle);
trElement.appendChild(ageEle);
trElement.appendChild(amkaEle);
tbodyElement.appendChild(trElement);
tableElement.appendChild(tbodyElement);
}
}
</script>
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title></title>
</head>
<body>

<div class="complete">
<div class="form">
<label>Fullname: <input id="fullname" type="text"></label>
<label>Age: <input id="age" type="number"></label>
<label>AMKA: <input id="amka" type="text"></label>
<span id="error"></span>
<button onclick="publishToTable()">Submit</button>
</div>
<div id="tables">
<table id="table">
<thead>
<tr>
<th>|Name/Surname|   </th>
<th>|Age|   </th>
<th>|AMKA|   </th><br><br><br><br><br>
</tr>
</thead>
</table>
</div>
</div>
</body>
</html>

相关内容

  • 没有找到相关文章

最新更新