捕获调整大小事件并获取 dhtmlx 模态窗口的宽度答案

【问题标题】：Catch resize event and get width of a dhtmlx modal window捕获调整大小事件并获取 dhtmlx 模态窗口的宽度
【发布时间】：2016-10-31 20:24:36
【问题描述】：

我想捕获一个 dhtmlx 模态窗口调整大小事件并获取窗口的宽度以在其内容上添加/删除 CSS 类。我的目标是在 dhtmlx 模态窗口中获得引导“响应式”布局。

我从未使用过 dhtmlx，而且我很难理解他们的文档。我编写了以下代码，重要的部分是底部的（事件捕获器）。现在，它什么也没做，因为我想我没有正确的语法。

您知道我如何拦截 dhtmlx 模态窗口调整大小并查看它的新宽度，以添加/删除 css 类吗？我想模仿引导媒体查询，但是对于模式窗口而不是整个媒体/网页。

var myForm, formData;
var dhxWins, w1;

function doOnLoad() {
    dhxWins = new dhtmlXWindows();
    dhxWins.attachViewportTo("vp");
    w1 = dhxWins.createWindow("w1", 10, 10, 300, 250);
    myForm = w1.attachHTMLString(
        '<div class="container-fluid">' +
          '<div class="form-group col-xs-6">' +
            '<label>label</label>' +
            '<div>' +
              '<input class="form-control" type="text">' +
            '</div>' +
          '</div>' +
        '</div>'
    );
}
doOnLoad();

w1.attachEvent("onResizeEnd", function(obj) {
    if (obj.width() < 640) {
        $('.form-group').removeClass('col-xs-6');
        $('.form-group').addClass('col-xs-12');
    }
});

如果你想尝试你的想法，你可以看到这个JSFiddle with the above code。

还是谢谢你。

【问题讨论】：

标签： jquery event-handling resize width dhtmlx

【解决方案1】：

我的代码有两个问题，终于找到了dhtmlx v3.6（我正在使用的那个）的解决方案。

事件的名称是“onResizeFinish”
宽度可从 obj.getDimension()[0] 访问

下面的代码可以很好地捕获 jsfiddle 中的事件。

w1.attachEvent("onResizeFinish", function(obj){
    if (obj.getDimension()[0] < 640){

【讨论】：