如何使用javascript为具有相同类/名称的元素集合触发css事件

Question

说这一切都在标题中我有这个javascript

<script>          
$(".tile").click(function(e){
 $(this).toggleClass("flipOutX")  ; 
})
</script> 

我有一些名为“tile”的html dfined框，这里的问题是当我单击一个单独的tile时，flipoutx函数可以工作，但只有我点击过的tile ....

我如何才能为所有称为“瓷砖”的瓷砖工作，而不仅仅是我点击过的瓷砖？

Answer 1

尝试......

$(".tile").click(function(e) {
  $(".tile").toggleClass("flipOutX"); 
});

将$(this)（单个图块）更改为$(".tile")（元素集合）是允许所有图块在单击时移动的内容。

简单更改您所引用的内容。您需要引用.tile（s），而不是引用使用此点击的tile。

Answer 2

使用

$(".tile").click(function(e){
$('.tile').toggleClass("flipOutX")  ; 
})