javascript - 单击事件仅在第一个元素上触发？

Question

我正在为我的 Wordpress 项目工作，我创建了一些 jQuery 代码，但它似乎只适用于第一个元素。

这是我的CSS：

<style type="text/css">
    #hide {
        display:none;
    }
</style>

这是我的 jQuery：

<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<script type="text/javascript">
    $(document).ready(function(){
        $("#show").click(function(){
            $("#hide").toggle();
            return false;
        });
    });
</script>

我究竟做错了什么？

Answer 1

您可能有多个具有相同名称的 ID（#show和#hide） - 将所有这些元素更改为使用一个类（ID 应该是唯一的），然后您可以将代码更改为如下所示：

$(document).ready(function(){
    $(".show").click(function(){
        $(this).toggleClass('hide');
        return false;
    });
});

并稍微更改您的CSS：

.hide {
  display:none;
}