如何仅针对我试图在 foreach 循环中显示的部分激活和关联 slideToggle 函数（使用 JavaScript）？

Question

我想在每次单击相关信息时显示产品的描述，但每次我单击随机信息时都会使用我的代码显示所有产品的所有描述。请帮助我。

      <script type="text/javascript">
            $(function () {
                  $("p.info").on('click', function () {
                  $("p.desc").slideToggle();
                });
          });
      </script>




     // the info and desc of the products are cointaned in:


     <div class="products_container">
            <ul>
                @foreach ($products as $product)
                    <li>
                        <div class="products">
                            @include('helpers/productImg', ['attrs' => 'imagefrm', 'imgFile' => 
      $product->image])
                            <p id="product_name"><strong>{{ $product->name }}</strong></p>
                            <p>{{ $product->descShort }}</p>
                            @include('helpers/productPrice')
                            <p class="info">Info prodotto</p>
                            <p style="display:none" class="desc">Descrizione: {!! $product->  
      `                     descLong !!}</p>
                        </div>
                    </li>
                @endforeach
            </ul>
            </div>

Answer 1

那是因为您使用的是 class .desc，这就是它使用 class 切换所有元素的原因。但是可以从您的代码中推断出 .desc 紧挨着 .info onclick 事件所以而不是

  $("p.info").on('click', function () {
              $("p.desc").slideToggle();
            });

你应该使用

  $("p.info").on('click', function () {
              $(this).next().slideToggle(); //element next to clicked p.info
            });

如何仅针对我试图在 foreach 循环中显示的部分激活和关联 slideToggle 函数（使用 JavaScript）？

How can i activate and associate slideToggle function (with JavaScriot) only for the one part i'm trying to show in a foreach loop?

javascript

php

slidetoggle