增加“<li>”相对于另一个“</li> <li>”</li>的高度

Question

我试图设置“li”的高度会相对于另一个“li”自动增加。

我已粘贴示例HTML代码。

<ul onclick="menu_slide('#sub1')" class="list listred" id="list">

<li onclick="toggle_div('toggle_div0')" class="name">

<span style="color:#fff;"> 

    <a style="color:#fff; text-decoration:none" href="Javascript:void(0)">Banerjee, Sraboni </a>
<br>

 UPN 414 
 </span>
<span style="color:#fff; font-weight:normal;">Billed On  06/13/2013 @ 12:11 pm</span>
<p id="last_event0" style="color:#fff;"> Assigned By Moumita Balasssssssssssssssssssss<br>sssssssssssssssssssssssss .</p>
</li>
<li class="bill">

<div style="">
<div style="display:none" id="checkedicon_0" class="tick_mark_list"> 
    <span style="cursor:pointer" onclick="remove_checkedicon(0, '1092')"><img width="25px" src="images/tick_mark.png"></span> 
</div>   
<!-- Code for message --> 
<!-- Checking whether this provider has any biller message or not starts -->
<div style="padding:6px 8px 0 8px; box-shadow: 0 0 9px -3px #000000 inset;
-webkit-box-shadow: 0 0 9px -3px #000000 inset;
-moz-box-shadow: 0 0 9px -3px #000000 inset;
-o-box-shadow: 0 0 9px -3px #000000 inset;float:left; border-radius:3px; background: #fff;  position: relative;
    right: 3px;
    top: 3px; visibility: hidden;"><span><img src="images/spech.png"></span>
    </div>
<!-- Checking whether this provider has any biller message or not ends -->
<!--Code for message-->

<!--<a href="add_bill.php?patient_id=&type=Primary" class="but3" style="margin-right:0;"><span>A</span>DD</a>patient_bill_id-->
        <a onclick="open_slide('1092', 'Sraboni Banerjee')" style="margin-right:0;" class="but3" href="Javascript:void(0)"><span>A</span>DD</a>
    <a onclick="unfollow_patient('1092','Primary','2')" class="unfollow" href="Javascript:void(0)"><span>X</span></a>
<div class="clear"></div>
</div>
<div class="clear"></div>
    </li>

    <div class="clear"></div>
</ul>

在这里你可以找到ul里面的2 li。我想用第一个li增加第二个li的高度。无论如何在jquery中解决这个问题。我附上了屏幕截图以便更好地理解。 。在这里你可以看到最右边按钮的第一行高度变得小于行的实际高度。

Answer 1

您可以试用the EqualHeights jQuery Plugin

  

插件的功能非常简单，因为它只设计了一件事：将指定的所有元素设置为相同的高度。

演示页面： http://www.cssnewbie.com/example/equal-heights/plugin.html

Answer 2

做你要求的事情非常简单。当您开始拥有充满所讨论元素的页面时，以及如果您希望它触发可能在代码外部发生的调整大小（如果发生这种情况），则会出现复杂性。这是一个基本的例子，但可以扩展......

http://jsfiddle.net/bfE4L/

有问题的主要代码是......

$("#li2").height($("#li1").height());