大家好，我很难理解如何使其工作。

我有8个不同的div，每一个都有一个img用作按钮和相同的类（tm-img）和隐藏的divs与额外的信息。我想要的是在beginnig上只显示img，当用户点击8个图像中的一个时，根据他们点击的图像显示隐藏的div。（现在发生的情况是，如果我点击一个图像，所有图像中隐藏的div都显示的不只是我点击的那个）

<div class="tm-full-container">
                <div class="team-member card-container blue-card">
                    <img class='tm-img' onclick='run()' src="/team_1.png" alt="">
                    <h5 class="tm-title">Chef</h6>
                
                <div class="tm-info">
                    <p class="tm-name">Rick Jones</p>
                    <p class="tm-position">Chef</p>
                </div>

                </div>

                <div class="tm-full-info">
                    <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Error magnam aliquam similique at 
                        ipsam accusamus sed enim, in non ipsa excepturi reprehenderit fugit velit libero mollitia 
                        tempora temporibus perspiciatis? Assumenda?</p>
                </div>
            </div>

<script>
     function run(){
      
      $('.tm-info').toggle();
      $('.tm-full-info').toggle();
      $('.tm-title').toggle();
    
     }</script>

所有其他7个div看起来都一样，但图像和名称（Rick）不同。

提前致谢。

示例

---

顺晟科技：

可以使用关键字this:https://www.yogihosting.com/jquery-this/

您可以执行下面代码段中的操作。使用关键字使单击的元素不是全部被触发。

还可以循环运行所有标记并触发（切换）单击事件

考虑以下事项。

关键在于使用正确的选择器和作用域。

<div class="tm-full-container">
                <div class="team-member card-container blue-card">
                    <img class='tm-img' onclick='run()' src="/team_1.png" alt="">
                    <h5 class="tm-title">Chef</h6>
                
                <div class="tm-info">
                    <p class="tm-name">Rick Jones</p>
                    <p class="tm-position">Chef</p>
                </div>

                </div>

                <div class="tm-full-info">
                    <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Error magnam aliquam similique at 
                        ipsam accusamus sed enim, in non ipsa excepturi reprehenderit fugit velit libero mollitia 
                        tempora temporibus perspiciatis? Assumenda?</p>
                </div>
            </div>

<script>
     function run(){
      
      $('.tm-info').toggle();
      $('.tm-full-info').toggle();
      $('.tm-title').toggle();
    
     }</script>

这与:

相同

<div class="tm-full-container">
                <div class="team-member card-container blue-card">
                    <img class='tm-img' onclick='run()' src="/team_1.png" alt="">
                    <h5 class="tm-title">Chef</h6>
                
                <div class="tm-info">
                    <p class="tm-name">Rick Jones</p>
                    <p class="tm-position">Chef</p>
                </div>

                </div>

                <div class="tm-full-info">
                    <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Error magnam aliquam similique at 
                        ipsam accusamus sed enim, in non ipsa excepturi reprehenderit fugit velit libero mollitia 
                        tempora temporibus perspiciatis? Assumenda?</p>
                </div>
            </div>

<script>
     function run(){
      
      $('.tm-info').toggle();
      $('.tm-full-info').toggle();
      $('.tm-title').toggle();
    
     }</script>