使用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();

});