Question

使用jQuery UI，我将表格加载到带有标签的div中。单击选项卡时，我需要更改th和tr元素的一些CSS属性。从技术上讲，一切都有效，但是当我点击一个标签时，CSS属性只会在第二个元素上更改。我必须再次单击该选项卡以对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更新代码，什么都没有。

$( "#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
} );

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

1 个答案: