[英]output returns as [object, Object]
I'm writing a code that take user input and stores it in an object array.我正在编写一个接受用户输入并将其存储在 object 数组中的代码。 However it doesn't seem to work the way I want it to.
但是,它似乎并没有按照我想要的方式工作。 whenever I try to print out the array it just says [object, Object].
每当我尝试打印出数组时,它只会显示 [object, Object]。 Thanks in advance!
提前致谢!
let addedProducts = []; let output = document.getElementById("output"); let productName = document.getElementById("product-name").value; let productAmount = document.getElementById("amount-stored").value; const addProduct = () => { product = { name: productName, amount: productAmount } addedProducts.push(product.name); addedProducts.push(product.amount); document.forms[0].reset(); } const showProducts = () => { output.innerHTML = addedProducts; }
<form> <label>ProductName</label> <input id="product-name" type="text"><br> <label>amount in store</label> <input id="amount-stored" type="text"><br> <input type="button" value="add product in array" onclick="addProduct()"> <input type="button" value="show products in array" onclick="showProducts()"> </form> <p id="output"></p>
Make sure you read values within addProduct
:确保您在
addProduct
中读取值:
const addProduct = () => {
let productName = document.getElementById("product-name").value;
let productAmount = document.getElementById("amount-stored").value;
product = {
name: productName,
amount: productAmount
}
addedProducts.push(product);;
document.forms[0].reset();
}
const showProducts = () => {
output.innerHTML = JSON.stringify(addedProducts, null, '\t');
}
let addedProducts = []; let output = document.getElementById("output"); const addProduct = () => { let productName = document.getElementById("product-name").value; let productAmount = document.getElementById("amount-stored").value; product = { name: productName, amount: productAmount } addedProducts.push(product);; document.forms[0].reset(); } const showProducts = () => { output.innerHTML = JSON.stringify(addedProducts, null, '\t'); }
<form> <label>ProductName</label> <input id="product-name" type="text"><br> <label>amount in store</label> <input id="amount-stored" type="text"><br> <input type="button" value="add product in array" onclick="addProduct()"> <input type="button" value="show products in array" onclick="showProducts()"> </form> <p id="output"></p>
The productName
and productAmount
are defined when your code is loaded, so they default to ""
. productName
和productAmount
是在加载代码时定义的,因此它们默认为""
。
When you click the buttons, the values have not been updated so you just add empty strings to addedProducts
.当您单击按钮时,值尚未更新,因此您只需将空字符串添加到
addedProducts
。
Try the following:尝试以下操作:
let addedProducts = [];
let output = document.getElementById("output");
const addProduct = () => {
let productName = document.getElementById("product-name").value;
let productAmount = document.getElementById("amount-stored").value;
product = {
name: productName,
amount: productAmount
}
addedProducts.push(product.name);
addedProducts.push(product.amount);
document.forms[0].reset();
}
const showProducts = () => {
output.innerHTML = addedProducts;
}
you have to print every element like:您必须打印每个元素,例如:
const showProducts = () => {
foreach(addedProducts as addedproduct)
output.innerHTML = output.innerHTML + addedproduct;
}
either:任何一个:
you have to write your code on event callback like onChange()
method.您必须在事件回调上编写代码,例如
onChange()
方法。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.