获取clientHeight jQuery可调整大小

Question

我正在尝试获取原始元素的clientHeight，它是传递给resize事件（see documentation on the resize event）的ui参数的属性。

我的代码如下：

mapTableContainer.resizable({
    handles: 'n',
    resize: function(event, ui){
        console.log(ui.originalElement.clientHeight);
    }
});

问题是我一直在＆＃34;未定义＆＃34;对于clientHeight。如果我只记录ui.originalElement，我可以看到clientHeight，所以我确定我只是错误地访问它，只是不确定访问它的正确方法。

（控制台登录图片ui.originalElement;请参阅clientHeight）

Answer 1

您可以使用：

• this.clientHeight

或

• ui.element[0].clientHeight

  

element：表示要调整大小的元素的jQuery对象

     

originalElement：表示原始元素被包装之前的jQuery对象

摘录：

＆＃13;

＆＃13;

$( "#resizable" ).resizable({
  handles: 'n',
  resize: function(event, ui){
      console.log('Original Height: ' + ui.originalSize.height + 
      ' Current height: ' + ui.size.height + 
            '  this clientheight: ' + this.clientHeight);
  }
});

＆＃13;

#resizable { width: 150px; height: 150px; padding: 0.5em; }
#resizable h3 { text-align: center; margin: 0; }

＆＃13;

<link href="https://code.jquery.com/ui/1.12.0/themes/smoothness/jquery-ui.css" rel="stylesheet"/>
<script src="https://code.jquery.com/jquery-1.12.3.min.js"></script>
<script src="https://code.jquery.com/ui/1.12.0/jquery-ui.js"></script>


<div id="resizable" class="ui-widget-content">
    <h3 class="ui-widget-header">Resizable</h3>
</div>

＆＃13;

＆＃13;

＆＃13;