js设置li高度与前面内容同高_js 设置li高度-优快云博客

本文介绍了一种在网页中使评分细则与审核部分的高度保持一致的方法，并提供了一个封装好的函数来简化这一过程。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

<%--评分细则--%>
<li class="td-grade-detailed li-detail" ng-show="tableColumn.pointsExplain.show">
    <ul class="grade-box grade-height">
        <li ng-repeat="(detailIndex,detail) in item.detailList" ng-bind="detail.pointsExplain"></li>
    </ul>
</li>
<li class="td-count li-detail" ng-show="tableColumn.selfExplain.show">
    <ul ng-repeat="(selfIndex,self) in item.selfList">
        <li ng-bind="self.pointsExplain"></li>
    </ul>
</li>
<li class="td-count li-detail" ng-show="tableColumn.selfScore.show" ng-bind="item.selfCheckScore"></li>
<%--审核--%>
<li class="td-audit li-detail" ng-show="tableColumn.examHandle.show">
    <ul class="grade-box audit-height">
        <li  ng-repeat="(examIndex,exam) in item.examList" ng-bind-html="asHtml(examIndex,exam,'exam')"></li>
    </ul>
</li>
<script>
    /*设置审核高度与细则一致*/
    $(".audit-height li").each(function(index){
        var grade = $(".grade-height li").eq(index);
        var height = grade.height();
        $(this).height(height);
        $(this).css("line-height",height+"px");
    });
</script>

获取评分细则的高度赋值给审核

如果多处li需要设置高度，写相同代码时，需要对each进行封装。例如：

/*计算li高度封装*/
$.fn.calcHeight=function (op) {
    this.each(function(index){
        var height = $(op.dom[index]).height();
        $(this[index]).height(height);
        $(this).css({"line-height":height+"px"});
    })
}
//调用
$(".audit-height li").calcHeight(
    {dom:$(".grade-height li") }
);