0

我在垂直标尺上使用 JQuery Resizable 小部件,如下面的链接所示。有一次,我开始使用东手柄调整大小并停止它。现在,我尝试再次调整标尺大小,但发现调整大小手柄没有出现。我检查了 html div,但 ui-resizable div 被删除了。任何形式的帮助都会很有用。

我的 JS 代码:

createRuler();

$('.ruler').resizable({
  handles: "e",
  resize: function(event, ui) {
    $('.ruler').empty();
    createRuler();
  },
  stop: function(event, ui) {},
  start: function(event, ui) {}
});

在这里查看完整代码

4

2 回答 2

1

我的 HTML 代码:

<div class="container">
 <div class='ruler'></div>
</div>

我更改了 JS 代码中的逻辑。我没有调整 inner-div(ruler) 的大小,而是在 external-div(container) 上调整大小,效果很好。

更新的 JS 代码:

创建尺子();

$('.container').resizable({
  handles: "e",
  alsoResize: ".ruler",
  resize: function(event, ui) {
    $('.ruler').empty();
    createRuler();
  },
  stop: function(event, ui) {},
  start: function(event, ui) {}
});
于 2016-04-13T16:01:02.393 回答
1

这一行打破了它:

 $('.ruler').empty();

我认为正在发生的事情是,您每次单击时都在转储数据(或引用 - 不确定 empty() 方法在您的应用程序中究竟做了什么)。当您第一次实例化它时这很好 - 但下次单击它时 - 您再次运行相同的功能 - 这次没有调整大小的数据。

尝试设置一些 $('.ruler').empty();仅在第一次单击标尺手柄时触发的逻辑。

于 2016-04-13T15:48:30.033 回答