<!DOCTYPE html>
<html>
<head>
<title></title>
<style type='text/css'>
div {
width: 400px;
}
#div1 {
height: 10px;
background-color: #ff0;
}
#div2 {
height: 20px;
background-color: #f0f;
}
#div3 {
height: 30px;
background-color: #0ff;
}
</style>
</head>
<body>
<div id="div1"></div>
<div id="div2"></div>
<div id="div3"></div>
<input type="button" id="test" value="test"></input>
</body>
<script type='text/javascript' src='http://code.jquery.com/jquery-1.8.0.min.js'></script>
<script type='text/javascript'>
$('#test').click(function(){
var maxHeight = 50;
$('div').each(function(){
if($(this).height() > maxHeight){
maxHeight = $(this).height();
}
});
$('div').height(maxHeight);
});
</script>
</html>
注:chrome ie8下运行均正常。
jquery each实现均衡元素的高度
最新推荐文章于 2017-12-20 16:31:02 发布