将输入的值推入数组中的某些位置 [英] Push values from inputs in certain positions in an array
本文介绍了将输入的值推入数组中的某些位置的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
继续进行使用输入中的数据更新数组。
现在我必须将值放入tmpARR数组中，例如：
Now I must put values into tmpARR array like:
var count = 0;
var tmpARR = ["count++", "text value from text input", "value from input Num 1", "0", "value from input Num 2", "Just some default text"];
问题是：我应该如何更改guardarNumeros（）来添加信息在像这样的数组中：
The question is: how should I change guardarNumeros() for adding information in an array like:
var tmpARR = ["count++", "text value from text input", "value from input Num 1", "0", "value from input Num 2", "Just some default text"];
感谢Pransh Tiwari，他是我的函数guardarNumeros（）编辑的。
Thanks for Pransh Tiwari who was edited my function guardarNumeros().
由于帖子中关于代码过多的规则，我无法在代码中添加代码段，所以我写了这个短语，对不起。
I was not be able to add snippet with my code because of stackoverflow's rules about too much code in the post so I wrote this phrase, sorry.
var totalInputs;
var myInputs;
var tmpARR = [];
var count = 0,
types = ['t', 'C' /*, 'Q'*/ ],
button = document.getElementById('button');
button.addEventListener("click", createInputs, false);
function createInputs() {
if (!validInput()) {
return;
}
count += 1;
createInput(count);
}
function createInput(count) {
totalInputs = document.getElementsByClassName('myInput').length;
var existingNode = document.getElementsByClassName('myInput')[totalInputs - 1];
types.forEach(function(type) {
var newNode = existingNode.cloneNode();
newNode.value = null;
newNode.id = type + +count;
newNode.placeholder = 'Placeholder ' + type;
newNode.dataset.id = 'id' + count;
appendNode(newNode);
})
}
function appendNode(node) {
document.querySelector('#div').appendChild(node);
}
function validInput() {
myInputs = document.getElementsByClassName('myInput');
var valid = true;
Array.prototype.slice.call(myInputs).forEach(function(input) {
input.classList.remove('error');
if (!input.value) {
input.classList.add('error');
valid = false;
}
});
return valid;
}
function removeError(event) {
event.classList.remove('error');
}
function guardarNumeros() {
boxvalue = document.getElementsByClassName('myInput');
i = 0;
while (i < boxvalue.length) {
if (boxvalue[i].type == "number") {
if (boxvalue[i+1] && boxvalue[i+1].type == "number") {
tmp = [boxvalue[i].value, boxvalue[i+1].value]
tmpArr.push(tmp);
i+=2;
}
} else {
i++;
}
}
console.log(tmpArr);
return false;
}
#title {
font-family: 'Times New Roman', Times, serif;
font-size: 200%;
}
#step {
font-size: 15pt;
clear: both;
}
#step2 {
font-size: 15pt;
clear: both;
}
#step3 {
font-size: 15pt;
clear: both;
}
summary {
background: #009688;
color: #fff;
padding: 5px;
margin-bottom: 3px;
text-align: left;
cursor: pointer;
padding: 5px;
width: 250px;
/*background-color: #4CAF50;*/
}
summary:hover {
background: #008999;
}
.displayBlockInline-Flex {
display: inline-flex;
}
#margin20 {
margin-left: 20px;
vertical-align: middle;
}
#container {
width: auto;
height: auto;
margin: 0 auto;
display: none;
}
a.myButton {
color: #fff;
/* цвет текста */
text-decoration: none;
/* убирать подчёркивание у ссылок */
user-select: none;
/* убирать выделение текста */
background: rgb(212, 75, 56);
/* фон кнопки */
outline: none;
/* убирать контур в Mozilla */
text-align: center;
cursor: pointer;
width: 150px;
padding-bottom: 11px;
}
a.myButton:hover {
background: rgb(232, 95, 76);
}
/* при наведении курсора мышки */
a.myButton:active {
background: rgb(152, 15, 0);
}
/* при нажатии */
.button1 {
/* background-color: #fc0; /* Цвет фона слоя */
/* padding: 5px; /* Поля вокруг текста */
float: left;
/* Обтекание по правому краю */
width: 450px;
/* Ширина слоя */
}
.button2 {
/* background-color: #c0c0c0; /* Цвет фона слоя */
/* padding: 5px; /* Поля вокруг текста */
width: 650px;
/* Ширина слоя */
float: right;
/* Обтекание по правому краю */
}
.clear {
clear: left;
/* Отмена обтекания */
}
.wrapper {
width: 1100px;
margin-left: 20px;
}
/*inputs*/
#div {
text-align: center;
}
.myInput {
height: 40px;
outline: none;
width: auto;
border: 1px solid #999;
border-radius: 4px;
padding: 5px 10px;
margin: 5px;
display: inline-block;
}
.myInput.error {
border: 1px solid red;
}
#action {
margin: 10px 0;
text-align: center;
}
#button {
width: 190px;
height: 40px;
background: #009688;
color: #fff;
font-weight: 600;
font-size: 13px;
border-radius: 4px;
border: none;
/* text-transform: uppercase;*/
outline: none;
cursor: pointer;
}
#button:hover {
background: #008999;
}
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.0/jquery.min.js"></script>
<center>
<input type="text" class="myInput" name="nameAlloy" placeholder="Name">
</center>
<div id="div">
<!--<form onsubmit="return guardarNumeros()">-->
<div id="action">
<button type="button" id="button">Add more inputs</button>
</div>
<input type="number" onkeypress="removeError(this)" class="myInput" data-id="id0" name="value[]" placeholder="Enter value 1">
<input type="number" onkeypress="removeError(this)" class="myInput" data-id="id0" name="value[]" placeholder="Enter value 2">
<div id="action">
<input type="submit" id="button" value="Add to array">
</div>
<!--</form>-->
</div>
更新1：
克雷西米尔，我已经试过了：
function guardarNumeros() {
boxvalue = document.getElementsByClassName('myInput');
i = 0;
var count = 0;
while (i < boxvalue.length) {
if (boxvalue[i].type == "number") {
if (boxvalue[i+1] && boxvalue[i+1].type == "number") {
tmp = [boxvalue[i].value, boxvalue[i+1].value]
tmp = rowsText.splice("Text", "Text", tmp[1], 0, tmp[2], "text");
rowsText.push(tmp);
i+=2;
}
} else {
i++;
}
}
console.log(rowsText);
return false;
}
我得到了什么：
["1", 0, undefined, "text", Array(6), Array(6), Array(6), Array(6), Array(0)]0: "1"1: 02: undefined3: "text"4: (6) ["1", "X5CrNi18", "0", "55", "0", "Steel"]5: (6) ["2", "X5CrNi18", "100", "55", "0.5", "Steel"]6: (6) ["6", "S355J2Q +Z35", "100", "20", "0.68", "Steel"]7: (6) ["8", "S355J2Q +Z35", "300", "20", "0.3", "Steel"]8: []length: 9__proto__: Array(0)
更新2：
插入之前我拥有的内容：
[
["1", "X5CrNi18", "0", "55", "0", "Steel"],
["2", "X5CrNi18", "100", "55", "0.5", "Steel"],
["6", "S355J2Q +Z35", "100", "20", "0.68", "Steel"],
["8", "S355J2Q +Z35", "300", "20", "0.3", "Steel"],
]
插入后我想要什么：
var count = 0;
[
["1", "X5CrNi18", "0", "55", "0", "Steel"],
["2", "X5CrNi18", "100", "55", "0.5", "Steel"],
["6", "S355J2Q +Z35", "100", "20", "0.68", "Steel"],
["8", "S355J2Q +Z35", "300", "20", "0.3", "Steel"],
["count++", "text value from text input", "value from input Num 1", "0", "value from input Num 2", "Just some default text"],
["count++", "text value from text input", "value from the next input Num 1", "0", "value from the next input Num 2", "Just some default text"]
]
推荐答案
据我对问题的理解，这是解决方案：
From my understanding of the problem this is the solution:
function guardarNumeros() {
boxvalue = document.getElementsByClassName('myInput');
i = 0;
count = 0;
defaultText = "Steel"
while (i < boxvalue.length) {
if (boxvalue[i].type == "number") {
if (boxvalue[i+1] && boxvalue[i+1].type == "number") {
textValue = document.getElementById('nameAlloy').value;
tmp = [count, textValue, boxvalue[i].value, 0, boxvalue[i+1].value, defaultText]
tmpARR.push(tmp);
i+=2;
count++;
}
} else {
i++;
}
}
console.log(tmpARR);
return false;
}
还可以轻松添加文本的值，并为其添加ID。
Also to add the value of text easily, add id to it.
<input type="text" class="myInput" name="nameAlloy" id="nameAlloy" placeholder="Name" >
这篇关于将输入的值推入数组中的某些位置的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
