Question

function myFunction(input){
var number_of_images = input.parentNode.getElementsByTagName("img")
var image_clicked = number_of_images.indexOf(input)
alert ("you clicked on image number "+image_clicked)
}

I am building a rating scale with three images. I want to communicate the user which of the three images he´s clicked on. I have onClick events on all three images onClick(this). Then, I am trying to use indexOf(input), where input is refers to the parameter (this) passed from an onclick(this). It´s not working. ¿Any alternative suggested? Thanks.

Answer 1

Calling indexOf on it will not work because the result is a (live) NodeList, and does not provide Array methods. Yet, you can still apply the Array indexOf method on the node list (by using the .call Function met), as it is generic:

var images = input.parentNode.getElementsByTagName("img");
var index = Array.prototype.indexOf.call(images, input);

Notice that older IEs do not support indexOf, you will need to shim it.