articleBody
| -
AvidLearner:
Here, my function sourceAlter only has the
parameter e and therefore, I did not pass any
parameters when I called the function, hence
image[i].addEventListener('click', sourceAlter)
without any parentheses and parameters. However, what if my
function requires two parameters, e.g. sourceAlter(a,
b) , how do I pass on the parameters to said function?
I don’t quite understand how looping works in JavaScript. It
somehow does not make sense to me how for (...) in my
code above worked. I do know that it loops five times (as expressed
in the conditional statement i < image.length ) and
that whenever an image with the order i
is clicked, we run a function. But, when we click picture 1, 2,3
and then 1 again, it somehow worked? There is not decrement in the
for loop, so how did it happen? Is the loop run over
again after each action (in this case, click (but doesn’t have to
be necessarily a click))?
So to answer the first question, this isn’t the simplest, but
it is possible. This stack overflow answer is useful, and contains
multiple ways of doing it:
https://stackoverflow.com/questions/256754/how-to-pass-arguments-to-addeventlistener-listener-function
For the second question, the loop only runs once. But one of the
main things the loop does is to add an onclick handler to each
image, using this code:
newImage.onclick = function(e) {
var imgSrc = e.target.getAttribute('src');
displayImage(imgSrc);
}
because that handler is added to each image, it is run every
time an image is clicked.
-
@chrisdavidmills I have some questions,
though, if you don’t mind me asking.
Here, my function sourceAlter only has the
parameter e and therefore, I did not pass any
parameters when I called the function, hence
image[i].addEventListener('click', sourceAlter)
without any parentheses and parameters. However, what if my
function requires two parameters, e.g. sourceAlter(a,
b), how do I pass on the parameters to said function?
I don’t quite understand how looping works in JavaScript. It
somehow does not make sense to me how for (...) in my
code above worked. I do know that it loops five times (as expressed
in the conditional statement i < image.length) and
that whenever an image with the order i
is clicked, we run a function. But, when we click picture 1, 2,3
and then 1 again, it somehow worked? There is not decrement in the
for loop, so how did it happen? Is the loop run over
again after each action (in this case, click (but doesn’t have to
be necessarily a click))?
-
AvidLearner:
Here, my function sourceAlter only has the
parameter e and therefore, I did not pass any
parameters when I called the function, hence
image[i].addEventListener('click', sourceAlter)
without any parentheses and parameters. However, what if my
function requires two parameters, e.g. sourceAlter(a,
b) , how do I pass on the parameters to said function?
I don’t quite understand how looping works in JavaScript. It
somehow does not make sense to me how for (...) in my
code above worked. I do know that it loops five times (as expressed
in the conditional statement i < image.length ) and
that whenever an image with the order i
is clicked, we run a function. But, when we click picture 1, 2,3
and then 1 again, it somehow worked? There is not decrement in the
for loop, so how did it happen? Is the loop run over
again after each action (in this case, click (but doesn’t have to
be necessarily a click))?
So to answer the first question, this isn’t the simplest, but it
is possible. This stack overflow answer is useful, and contains
multiple ways of doing it:
https://stackoverflow.com/questions/256754/how-to-pass-arguments-to-addeventlistener-listener-function
For the second question, the loop only runs once. But one of the
main things the loop does is to add an onclick handler to each
image, using this code:
newImage.onclick = function(e) {
var imgSrc = e.target.getAttribute('src');
displayImage(imgSrc);
}
because that handler is added to each image, it is run every
time an image is clicked.
|