javascript - jQuery-可调整大小 : Resize event of div is not triggered

Question

我有以下代码，它可以调整由 splitter-div 分隔的两个面板的大小(摘自 this great example 作者:Rick Strahl)

我正在尝试触发调整大小事件，但不知怎的，这没有注册。我在这里缺少什么想法吗？已经谢谢了。

   $(".flex-item-top").resizable({
      handleSelector: ".splitter",
      resizeWidth: false,
      resize: function(event, ui) {
        console.log("Let's get schwifty!")
      }
    })

CodePen

编辑:有点晚了，但我仍然没有弄清楚为什么事件没有触发。不过，现在我通过“拖动”事件找到了一个解决方案，这是我在另一篇 Stack Overflow 帖子中找到的，也许对某人有帮助:)

var isDragging = false;
$(".splitter")
.mousedown(function() {
    isDragging = true;
})
.mousemove(function() {
  if (isDragging) {
     console.log('hello')
  } 
 })
.mouseup(function() {
    isDragging = false;
})

Answer 1

所以我发现 jQuery-UI 和调用的 resizeable.js 库之间存在某种冲突。当您省略 jQuery-UI 库时，您会得到拆分器移动。

   <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
   <script type="text/javascript" src="https://rawgit.com/RickStrahl/jquery-resizable/master/src/jquery-resizable.js"></script>

这些应该是您调用的唯一库。