Question

<div class="row featurette">
   <div class="col-md-5">
      <img class="featurette-image img-responsive" src="img/serv_thumb.png" alt="Generic placeholder image" title="916 x 458">
   </div>
   <div class="col-md-7">
      <h2 class="featurette-heading">News Story Uno 
          <span class="text-muted"></span>     
      </h2>
      <p class="sub">He aquí una rápida veraniego de la noticia, ya que el promedio de atención de un americano hoy es de alrededor de 5 segundos. Pero si lo desea, haga clic aquí para leer más!</p>
      <button class="btn-default btn-sm btn-marketing">Expand Story</button>
      <p class="hidden">Estamos agregando constantemente a nuestra cartera de contenido de vídeo de alta calidad. Lo que encontrará aquí son ejemplos de nuestros servicios que se muestran a través de productos terminados de los clientes podía comprender. Yo, literalmente, sólo añadí esta historia para obtener la página para desplazarse. Creo seis y cincuenta y seis relatos de la página debe ser bueno, y luego tener el botón de archivo a continuación.</p>
      <p class="hidden">Yo, literalmente, sólo añadí esta historia para obtener la página para desplazarse. Creo seis y cincuenta y seis relatos de la página debe ser bueno, y luego tener el botón de archivo a continuación. Estamos agregando constantemente a nuestra cartera de contenido de vídeo de alta calidad. Lo que encontrará aquí son ejemplos de nuestros servicios que se muestran a través de productos terminados de los clientes podía comprender.</p>
   </div>
</div>

这是我的<div> ......相当标准。这是一个可扩展的新闻报道。隐藏了cals的段落在我的jQuery / JS文件中由$(".hidden").hide(0);行隐藏。但是，我很难过。

我如何只获取与div到button on .slideToggle();相同的{{1}}段落？

Answer 1

您可以使用 .siblings() ：

$('button.btn-default').click(function() {
    $(this).siblings('p.hidden').slideToggle();
});

或 .nextAll() ：

$('button.btn-default').click(function() {
    $(this).nextAll('p.hidden').slideToggle();
});

<强> Fiddle Demo

在与<button> </button> </div>相同的</p> <div>中展开<p>

1 个答案: