如何在jQuery中检测和更改div高度 [英] How to detect and change div height in jQuery

问题描述

首先，我要说的是，由于布局的复杂设计，我最终编写了一个称为equalHeights的函数，该函数基本上会查看布局中的几个div，并选择最高的并设置其余高度，以便我可以以具有相同高度的div结束.因此，基本上，在页面加载之后，如果您查看代码，您将看到style ="height:xxx"应用于每个div.我无法更改此设置，因此任何解决方案都无法使用此功能.

let me start by saying that due to the complicated design of the layout I ended up writing a function called equalHeights which basically looks at several divs in my layout and picks the highest and sets the height of rest to that, so that I can end up with divs that have equal heights. So basically after the page load, if you look into the code you will see style="height:xxx" is applied to each div. This I cannot change so any solution cannot touch this functionality.

div的溢出也设置为隐藏"，这又是有目的的，不能更改.

The divs also have overflow set to hidden which again has its purpose and cannot change.

因此，鉴于以上几点，我需要做的是能够基于用户交互性所引起的变化来更改div的高度.例如，我有一个带有一些隐藏行的表，这些隐藏行在用户单击链接时会扩展.由于溢出，表格的多余长度将被隐藏，我需要div的大小来扩展.同时，我不想将此扩展绑定到该特定点击，而是希望Javascript检测内容的变化并相应地扩展div.我不希望这样绑定的原因是因为我需要在具有相同布局的不同页面中实现此功能，并且我不想为每个事件编写代码.

So with the above in mind, what I need to do is to be able to change the height of the divs based on changes due to user interactivity. For example I have a table with some hidden rows which get expanded as the user clicks on a link. The extra lenght of the table will then be hidden due to overflow, I need the size of the div to expand. At the same time I don't want to bind this expansion to that specific click, I want Javascript to detect change in the content and expand my div accordingly. The reason I don't want it bind like that is because I need this implemented in different pages with the same layout and I don't want to code for every event.

我都尝试过:

$("#myDiv").resize(function(){
    equalHeight($("#myDiv"));
});

和

$("#myDiv").content().resize(function(){
    equalHeight($("#myDiv"));
});

似乎都不起作用！有什么想法吗?

neither seem to work! Any ideas?

推荐答案

基本的resize事件只能绑定到$(window)，如果要能够将resize事件绑定到$(window)，则需要使用插件. div:

The basic resize event can only be bound to $(window), you need to use a plugin if you want to be able to bind the resize event to a div:

http://benalman.com/projects/jquery-resize-plugin/

这篇关于如何在jQuery中检测和更改div高度的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！