我是 JavaScript 新手,不知道为什么我的 2D 数组(每个主行元素都包含“Word”和“颜色值”列元素)没有使用用户输入的表单值进行更新?另外为什么它不显示数组? 非常感谢任何帮助!
HTML 代码:
<html>
<head>
Your current list of words to search:
<p id = "Array"> </p>
</head>
<body>
<form>
Input Word:<br><br>
<input type="text" id="wordInputId" ><br>
<br> Highlight Color: <select name="colortype" id="colorTypeId">
<br>
<br>
<option value="1">Blue</option>
<option value="2">Green</option>
<option value="3">Red</option>
<option value="4">Yellow</option>
</select>
<br/>
<br/>
<input type="button" name="submit" value="Add Word" onclick="addEntry( inventory, document.getElementById('wordInputId').value, document.getElementById('colorTypeId').value )"/>
</form>
<br>
<button> Search Page</button>
<script src="Words.js">
var inventory = [[]];
displayInventory(inventory);
</script>
</body>
</html>
JS 函数 (Words.js):
function displayInventory(inventory){
document.getElementById("Array").innerHTML = inventory.toString();
}
function addEntry(inventory, word, color){
inventory.push([[word.value],[color.value]]);
//displayInventory(inventory);
}
最佳答案
在同一脚本标记中使用 src
和脚本行是定义脚本的错误方法。首先你需要将它们分开。然后,您的 displayInventory
函数仅在编译脚本时调用一次。您可以通过将其绑定(bind)到单击事件来检查它。此外,您不需要使用按钮发送 inventory
数组。它已经在脚本中定义了。此外,您还可以在代码中第二次获得values
。这意味着你正在试图获得值(value),这是不好的。请检查此代码。
var inventory = [[]];
function displayInventory(inventory){
document.getElementById("Array").innerHTML = inventory.toString();
}
function addEntry(word, color){
inventory.push([[word],[color]]);
displayInventory(inventory);
}
<html>
<head>
</head>
<body>
Your current list of words to search:
<p id = "Array"> </p>
<form>
Input Word:<br><br>
<input type="text" id="wordInputId" ><br>
<br> Highlight Color: <select name="colortype" id="colorTypeId">
<br>
<br>
<option value="1">Blue</option>
<option value="2">Green</option>
<option value="3">Red</option>
<option value="4">Yellow</option>
</select>
<br/>
<br/>
<input type="button" name="submit" value="Add Word" onclick="addEntry(document.getElementById('wordInputId').value, document.getElementById('colorTypeId').value)"/>
</form>
<br>
<button> Search Page</button>
</body>
</html>
关于javascript - 如何在 Javascript 中使用表单值推送 2D 数组,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/49507512/