如何使用Jquery为以下场景

Question

在HTML结构下面，我想找到ul的高度，并将最大高度设置为所有ul。下面是我用来设置身高的代码。但对我来说，它的UL设置为0。如何设置UL的最大高度。在css中给了.col-sm-2.list-unstyled as float：left also。

HTML

  <ul class="dropdown-menu">
    <li>
        <!-- Content container to add padding -->
        <div class="yamm-content">
            <div class="row">
                <ul class="col-sm-2 list-unstyled">
                    <li>
                        <a href="/residential/en/us/about/">About Carrier</a>
                    </li>
                    <li>
                        <a href="/residential/en/us/about/corevalues/">Core Values</a>
                    </li>
                    <li>
                        <a href="/residential/en/us/about/fact-sheet/">Fact Sheet</a>
                    </li>
                    <li>
                        <a href="/residential/en/us/about/willis-carrier/">Willis Carrier</a>
                    </li>
                    <li>
                        <a href="/residential/en/us/about/history/">Carrier History</a>
                    </li>
                </ul>

                <ul class="promotions-block menupromotion col-sm-2 list-unstyled hidden-xs">
                    <li class="holder col-lg-12 col-md-12 col-sm-4">
                        <div class="promo_wrpr">
                            <a class="inpage-module-link" href="http://www.naturalleader.com" target="_blank">
                                <section class="promo_img_hldr">
                                    <img src="demo/img/natural-leadership-sustainability-utc-82x76.jpg"
                                         title="Learn about Natural Leadership and Sustainability at United Technologies Corporation"
                                         alt="Learn about Natural Leadership and Sustainability at United Technologies Corporation"
                                         class="img-responsive">
                                </section>
                                <div class="promo-text">
                                    <h3>
                                        <strong>NATURAL LEADERSHIP</strong>
                                    </h3>
                                    <span class="common-cta rightarrow">
                                        Learn about sustainability
                                        <span class="link-2liner">
                                        </span>
                                    </span>
                                </div>
                            </a>
                        </div>
                    </li>
                </ul>
            </div>
        </div>
    </li>
</ul>

JS部分

 var b = $(".col-sm-2.list-unstyled").length;
        var c=0;        
        $(".col-sm-2.list-unstyled").each(function() {
                 if ($(this).height() > c) {
                c = $(this).height()
            }
        }); 
        for (var a = 0; a < b; a++) {
        $(".col-sm-2.list-unstyled").eq(a).removeAttr("style")
            $(".col-sm-2.list-unstyled").eq(a).height(c)
        } 

请帮我设定身高。提前致谢

Answer 1

我建议使用jquery来达到这个目的。它很简单，就像一个魅力 获得主要ul的高度;我猜这是.list-unstyled ul;并将其分配给变量。 然后你可以使用jQuery使用变量来分配ul高度。

                        jQuery(document).ready(function() { 

                                    var setHeight = $(".list-unstyled").height();
                                    $(".promotions-block").height(setHeight);
                                    }
                                    });

Answer 2

这对我有用：http://plnkr.co/edit/ncQ97aQOLXBSY0QBeMW9?p=preview

两个div都设置为相同的高度。

var b = $(".col-sm-2.list-unstyled").length;
var c = 0;
$(".col-sm-2.list-unstyled").each(function() {
  if ($(this).height() > c) {
    c = $(this).height()
  }
});
for (var a = 0; a < b; a++) {
  $(".col-sm-2.list-unstyled").eq(a).height(c)
}