如何处理调整大小事件答案

【问题标题】：How to get handle on resize event如何处理调整大小事件
【发布时间】：2011-03-23 01:47:07
【问题描述】：

我需要知道当前正在拖动哪个手柄，向东还是向西。

$("#mydiv").resizable({
    handles: 'e, w',
    resize: function(event, ui) {
        // to do: get active handle
    }

任何帮助将不胜感激。谢谢。

【问题讨论】：

我有，但没找到，你能帮忙吗？
@alex 回答了，谢谢。

标签： jquery jquery-ui resizable

【解决方案1】：

使用 jquery 有类它工作太慢，只需使用

if(ui.position.left != ui.originalPosition.left) //for west resize

那么你可以知道东或西被调整了大小

【讨论】：

【解决方案2】：

$( '#mydiv' ).resizable({
    resize: function( event, ui ) {
        // this will return direction as "n", "e", "s", "se" etc.
        var $direction = $( this ).data( 'resizable' ).axis;
    }
});

【讨论】：

【解决方案3】：

检查事件对象：

var west = $(event.srcElement).hasClass('ui-resizable-w');

【讨论】：

这在 Firefox 20 中不起作用，其中 event.srcElement 是 undefined。在 Firefox 20 中 e.originalEvent.target 确实有效，但不可靠（通常返回可拖动元素下方的元素）。
在 Firefox 中使用 e.target 代替 e.srcElement

【解决方案4】：

比这更简单，只需获取事件的目标（即触发事件的 DOM 元素）

$(event.target)

【讨论】：

【解决方案5】：

这对我有用：（可调整大小的开始事件）

if (e.toElement.className.indexOf("ui-resizable-w") >= 0) {
  console.log('west');
} else if (e.toElement.className.indexOf("ui-resizable-e") >= 0) {
  console.log('east');
}

【讨论】：

【解决方案6】：

这在 jQuery UI v1.11.4 中适用于我

$(event.target).data('uiResizable').axis

【讨论】：