要将HTML输入值存储在JavaScript变量中,并将其显示在表中,可以按照以下步骤进行操作:
<form id="myForm">
<input type="text" id="inputValue">
<button type="submit">提交</button>
</form>
document.getElementById("myForm").addEventListener("submit", function(event) {
event.preventDefault(); // 阻止表单提交
var inputValue = document.getElementById("inputValue").value;
// 将输入值存储在变量inputValue中
});
var table = document.createElement("table");
var row = table.insertRow();
var cell = row.insertCell();
cell.innerHTML = inputValue;
// 将存储的值插入到表格中
document.getElementById("tableContainer").appendChild(table);
// 将表格添加到id为tableContainer的元素中
完整的示例代码如下:
<!DOCTYPE html>
<html>
<head>
<title>存储和显示输入值</title>
</head>
<body>
<form id="myForm">
<input type="text" id="inputValue">
<button type="submit">提交</button>
</form>
<div id="tableContainer"></div>
<script>
document.getElementById("myForm").addEventListener("submit", function(event) {
event.preventDefault(); // 阻止表单提交
var inputValue = document.getElementById("inputValue").value;
// 将输入值存储在变量inputValue中
var table = document.createElement("table");
var row = table.insertRow();
var cell = row.insertCell();
cell.innerHTML = inputValue;
// 将存储的值插入到表格中
document.getElementById("tableContainer").appendChild(table);
// 将表格添加到id为tableContainer的元素中
});
</script>
</body>
</html>
这样,当用户在输入框中输入值并点击提交按钮时,输入值将被存储在JavaScript变量中,并显示在表格中。
领取专属 10元无门槛券
手把手带您无忧上云