jQuery-Resizable:未触发div的Resize事件

Question

我有以下代码，它允许调整由拆分器div分隔的两个面板的大小(取自Rick Strahl从this great example )

我正在尝试触发一个调整大小的事件，但不知何故这并未注册。你知道我这里漏掉了什么吗？已经谢谢你了。

   $(".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>

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