javascript - Event listener giving error -


i have code example:

<html> <input class="basketquantity" type=number>basket item 1</input> <input class="basketquantity" type=number>basket item 2</input> </html>  <script> quantityinputs = document.queryselectorall(".basketquantity"); for(var in quantityinputs){     quantityinputs[i].addeventlistener('change', function(){         console.log(quantityinputs[i]);     }); } </script>

when run error message:

typeerror: quantityinputs[i].addeventlistener not function

could tell me why happening?

quantityinputs = document.queryselectorall(".basketquantity");

first of quantityinputs nodelist object. so

for(var in quantityinputs){     console.log(i); }

will return enumerable properties - quantityinputs object , prototype chain, not own (just quantityinputs enumerable properties). for .. in return length field , item enumerable properties prototype chain , properties not dom nodes , don't have addeventlistener method.

you must use object.keys:

var nodearray = [].slice.call(document.queryselectorall(".basketquantity"));  object.keys(nodearray).foreach(function (node) {     // node.addeventlistener });

or

or for .. in hasownproperty check:

quantityinputs = document.queryselectorall(".basketquantity"); for(var in quantityinputs){     if (quantityinputs.hasownproperty(i)) {         // quantityinputs[i].addeventlistener     } }

or

in future (es6) can use in case for .. of loop:

var quantityinputs = document.queryselectorall("basketquantity");  (var node of quantityinputs) {     console.log(node.addeventlistener); }

note(thanks @teemu):

also have error in handler i:

quantityinputs[i].addeventlistener('change', function(){     console.log(quantityinputs[i]);// return value of quantityinputs last });

so better use this addeventlistener target:

quantityinputs[i].addeventlistener('change', function(){     console.log(this); });

-

Popular posts from this blog

debugging - Reference - What does this error mean in PHP? -

what this? this number of answers warnings, errors , notices might encounter while programming php , have no clue how fix. community wiki, invited participate in adding , maintaining list. why this? questions "headers sent" or "calling member of non-object" pop on stack overflow. root cause of questions same. answers questions typically repeat them , show op line change in his/her particular case. these answers not add value site because apply op's particular code. other users having same error can not read solution out of because localized. sad, because once understood root cause, fixing error trivial. hence, list tries explain solution in general way apply. what should here? if question has been marked duplicate of this, please find error message below , apply fix code. answers contain further links investigate in case shouldn't clear general answer alone. if want contribute, please add "favorite" error message, warning or notic...
Read more

c++ - Why doesn't unordered_set provide an array access operator -

i'm curious why stl container unordered_set , has constant time complexity random access on average, not provide method accessing elements distance first element in container. example: t& unordered_set::operator[](size_t index) { return *(begin() + index); } accessing element "by distance" implies there meaningful way measure distance. trouble std::unordered_set is is, well, unordered . hence, there no meaningful way of explaining "some distance beginning" in non-arbitrary way. if want access distance, copy data vector: std::vector tmp(unordered.begin(), unordered.end());
Read more