Nathan, I believe you should be encountering some problem with the scope of the variables, try to make the following changes.
try to use some more structured way to group your elements, either using namespace
, class
, data-custom
As your code already uses something similar to a namespace, then I'll post an example using namespace:
var campos = document.querySelectorAll("[id|='campo']");
[].forEach.call(campos, function (campo, indice) {
console.log(campo, indice);
});
<input id="campo-1" type="text" />
<input id="campo-2" type="text" />
<input id="campo-3" type="text" />
<input id="campo-4" type="text" />
<input id="campo-5" type="text" />
<input id="campo-6" type="text" />
<input id="campos" type="text" />
The [campo|='namespace']
selector will take all elements whose value of the selected field (in the id
case) has namespace
informed, that is, start with a certain string
, followed by hifen
so in the example above the input#campos
is not captured by the selector.
As you are passing your cont
to funcaoB
, I believe you are redoing the query ( getElementById
), so I advise you to pass input#campo-n
.
var campos = document.querySelectorAll("[id|='campo']");
var funcaoB = function (campo, indice) {
window.setTimeout(function () {
console.log(campo.id, campo.type);
}, (indice + 1) * 1000)
};
[].forEach.call(campos, function (campo, indice) {
funcaoB(campo, indice);
});
<input id="campo-1" type="text" />
<input id="campo-2" type="number" />
<input id="campo-3" type="date" />
<input id="campo-4" type="time" />
<input id="campo-5" type="email" />
<input id="campo-6" type="tel" />
<input id="campos" type="text" />
Note that in the above example, even using window.setTimeout
to simulate a AJAX
request, I had no problem catching id
and type
of every input
.
In any case it is difficult to help you without seeing the whole script, after all your problem is possibly less than%