我有一个带有不同选项卡的 div,每个选项卡都包含一个表格。内容将动态加载到每个表中,因此我需要一种方法来同等地设置每个表的 th 和 tr 元素的高度。例如,如果 table1 的高度为 50px,则 table2 的高度也需要为 50px。
我正在使用的代码有效,但由于某种原因,它在每个选项卡开关上的每个元素的高度上添加了一个像素。例如,如果我单击第二个选项卡,所有 tr 元素都将为 50px。如果我单击第一个选项卡,然后返回第二个选项卡,tr 元素将更改为 51px 高。如果我单击返回第一个选项卡,然后单击第二个选项卡,tr 元素将更改为 52px 高等。
这是我的代码:
$( "#new-locations-tabs" ).tabs({
activate: function(events, ui) {
var getHeadingHeight = $("#new-locations-tabs .ui-tabs-panel:visible .right-table th").css("height");
$("#new-locations-tabs .ui-tabs-panel:visible .left-table th").css("height", getHeadingHeight);
var getRowHeight = $("#new-locations-tabs .ui-tabs-panel:visible .left-table td").css("height");
$("#new-locations-tabs .ui-tabs-panel:visible .right-table td, #new-locations-tabs .ui-tabs-panel:visible .left-table td").css("height", getRowHeight);
}
});
最佳答案
"Note that the computed style of an element may not be the same as the value specified for that element in a style sheet."
可能发生了一些计算舍入。尝试使用height()
或outerHeight()
相反。
"The difference between .css( "height" ) and .height() is that the latter returns a unit-less pixel value (for example, 400) while the former returns a value with units intact (for example, 400px). The .height() method is recommended when an element's height needs to be used in a mathematical calculation."
关于javascript - jQuery UI 选项卡激活事件无法正常运行,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/22175615/