javascript - resizable 是添加第二个包装器而不是更改第一个包装器的大小

Question

我正在使用 resizable() 和 draggable() jquery UI 函数来操作我的应用程序中的图片。

代码工作正常：

  $(document).on('click', 'img', function(event){ 
         $(this).resizable(); 
         $(".ui-wrapper").draggable();

    return false;
   });

问题是，当我回到我的应用程序的“内容编辑器”模式时，它会出错，因为 resizable() 正在添加第二个“.ui-wrapper”而不是操作旧的。

您可以在我的应用程序上看到问题- 进入内容模式，添加图片，调整大小，返回样式模式，而不是再次返回内容模式 - 在这里，当您单击图片时，可调整大小和可拖动无法正常工作. 效果是这样的：http: //jsfiddle.net/7GrbM/6/

Answer 1

您的方法会带来很多麻烦，我会在图像上放置一个按钮拖动/调整大小，如果单击，则首先销毁可调整大小/可拖动的实例，然后再破坏该图像的可调整大小/可拖动；为用户做更多的工作以减少意外

然后改变模式->全部重置为不可拖动/不可调整大小

或者我默认将所有 img 可调整大小/可拖动（并在保存/导出/任何内容时销毁

为什么不呢？

 $(document).on('click', 'img', function(event){ 

     $(this).resizable().draggable();

return false;
});