无法将单击事件绑定到元素的类集合
无法将单击事件绑定到元素的类集合
提问于 2017-12-13 16:46:15
我有一个图像模式，当我将一个事件处理程序绑定到一个Id上时，它就会工作，但当我将它应用于一个类，让它在任何单击的图像上触发时，它就不会工作了。
下面是html的一部分。
<div class="column">
<img src="images/journalism-images/j1.jpg" class="grid-img" id="myImage">
<img src="images/journalism-images/j2.jpg" class="grid-img">
</div>下面是我的Javascript
var modal = document.getElementById('myModal');
var img = document.getElementById('myImg');
var modalImg = document.getElementById("img01");
var images = document.getElementById("myImage");
var close = document.querySelector(".image-modal-close");
function changeImage() {
img.src = modalImg.src;
}
images.onclick = function(){
modal.style.display = "block";
modalImg.src = this.src;
changeImage();
}所以基本上发生的事情是，我将#myImage的ID放在任何图像上都会触发具有正确图像src的模式，但当我使用以下内容时，我不能触发模式-
document.querySelectorAll(".grid-img");有人能帮我吗？
Stack Overflow用户
发布于 2017-12-13 17:26:50
使用jquery执行以下操作：
$(".grid-img").on("click", function() {
//logic
}QuerySelectorAll将返回元素的集合。
如果你想要javascript：
document.getElementsByClassName("grid-img").addEventListener("click",function(e) {
//Your logic
}您还可以观看getElementsByClassName的Example
getElementsByClassBame**:**的示例
var element = document.getElementsByClassName("grid-img");
element[0].addEventListener("click",function(e) {
//Your logic
}
element[1].addEventListener("click",function(e) {
//Your logic
}页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/47788814
复制相关文章
相似问题
腾讯云开发者
