使用jquery使子div在一行上相等

Question

我需要让孩子们的 div 彼此相等，它与列在一起的时间有多长。 我只有一行，其余的将是引导程序之外的一列。

这是我创建的小提琴

http://jsfiddle.net/Qr48S/60/

我已经使它相等，但我的问题是脚本正在获取最高的 div 并将其应用于其他列，这使得其他列在没有那么长的内容时具有很大的空白。 我需要的是每行获取它，尽管我没有声明不止一行。

按钮也需要在列的底部

看起来像这样

<div class="container">
  <div class="row">
    <div class="item-container col-lg-4 col-md-4 col-sm-4">
      <div class="image"><img class="img-responsive"  
      src="http://placehold.it/350x150"></div>
      <div class="item-title"> 
         title title title title title title title 
         title title title title title title title title title 
      </div>
      <div class="item-details"> 
        <p>details 1</p>
        <p>details 2</p>
        <p>details 3</p>
        <p>details 4</p>
      </div>
      <div class="item-button"> 
         <button type="button" class="btn btn-primary">Add to cart</button> 
      </div>
      </div>

      <div class="item-container col-lg-4 col-md-4 col-sm-4">
      <div class="image"><img class="img-responsive"  
      src="http://placehold.it/350x150"></div>
      <div class="item-title"> 
         title title title title title title title 
         title title title title title title title title title
         title title title title title title title 
         title title title title title title title title title 
      </div>
      <div class="item-details"> 
        <p>details 1</p>
        <p>details 2</p>
        <p>details 3</p>
        <p>details 4</p>
        <p>details 1</p>
        <p>details 2</p>
        <p>details 3</p>
        <p>details 4</p>
      </div>
      <div class="item-button"> 
         <button type="button" class="btn btn-primary">Add to cart</button> 
      </div>
      </div>
   </div> 
</div>

Answer 1

我的建议是使用匹配高度插件

我已经将它粘贴到你的 jsfiddle 的这个分支中

http://jsfiddle.net/n2e4wg76/

然后你可以看到它会让它变得更简单。 当然，不是粘贴整个 js 文件，而是包含来自https://github.com/liabru/jquery-match-height的 js 文件

然后只需使用

$(document).ready(function() {

    $('.item-container').matchHeight();

});