Alternative to `onclick` in `img_tag`

I have a group of image thumbnails where I would like to swap out a larger image with the one that has just been clicked. I just noticed that img_tag doesn’t generate onclick events. Obviously, I could just build my own tag, but now I’m wondering what the alternative to onclick would be.

Any insights?

1 Like

Something like this:

<%= img_tag ..., id: "main-photo" %>
<%= img_tag ..., data: [swappable: "main-photo"] %>
document.querySelectorAll("img[data-swappable]").forEach(thumbnail => {
  thumbnail.addEventListener("click", e => {
    document.getElementByid(thumbnail.getAttribute("data-swappable")).src = thumbnail.src

Thank you, Chris!

1 Like