按钮需要多次点击才能进行更改：jQuery

Question

使用jQuery UI，我将表格加载到带有制表符的div中。当单击一个选项卡时，我需要更改th和tr元素上的一些CSS属性。从技术上讲，一切正常，但当我点击一个选项卡时，CSS属性只在第th个元素上发生变化。我必须再次单击该选项卡才能对tr元素进行更改。我需要在点击标签时进行两项更改。这里是我的功能：

var setHeadingHeight = function() { 

    $('.ui-tabs-nav li a').click(function() { 
    var getHeadingHeight = $("#new-locations-tabs .ui-tabs-panel:visible .right-table th").css("height"); 
    var getRowHeight = $("#new-locations-tabs .ui-tabs-panel:visible .left-table tr").css("height"); 

    $("#new-locations-tabs .ui-tabs-panel:visible .left-table th").css("height", getHeadingHeight); 
    $("#new-locations-tabs .ui-tabs-panel:visible .right-table tr").css("height", getRowHeight); 
    }); 

}; 

编辑：更新代码与tabsload，stil什么都没有。

$("#new-locations-tabs").on("tabsload", function(event, ui) { 
    $('.ui-tabs-nav li a').click(function() { 
     var test = $("#new-locations-tabs .ui-tabs-panel:visible .right-table th").css('height'); 
     var testa = $("#new-locations-tabs .ui-tabs-panel:visible .left-table tr").css('height'); 

     $("#new-locations-tabs .ui-tabs-panel:visible .left-table th").css("height", test); 
     $("#new-locations-tabs .ui-tabs-panel:visible .right-table tr").css("height", testa); 
    }); 
}); 

Answer 1

因为元素尚未显示。高度将不正确。您需要监听要加载的标签

$(".selector").on("tabsload", function(event, ui) { 
    //set height here 
});