Question

我正在使用DHTMLX Grid，我正在使用类似

的方法构建多个网格对象

JS：

function renderGrid(render_area, dataURL, skin, loop_index) {
    var scope = this;
    var grid_obj = loop_index + '_grid';
    grid_obj = new dhtmlXGridObject($(render_area).attr('id'));
    grid_obj.selMultiRows = true;
    grid_obj.imgURL = "codebase/imgs/";
    grid_obj.init();
    grid_obj.setSkin(skin);
    grid_obj.load(dataURL);
}

我使用jquery插件执行此操作。现在我想将'RowSelect'事件附加到所有这些动态创建的网格。

我想过在HTML页面上使用网格对象并在此处附加事件 0_grid.attachEvent("onRowSelect",scope.clickEvent);

但遗憾的是我无法在HTML页面上获取这些动态创建的网格对象（HTML页面上未定义0_grid）。

如果有人能给我一些好的解决方案，我很高兴

Answer 1

您可以使用jquery's .on method将事件附加到动态创建的元素。您需要将事件附加到作为网格元素父级的静态元素。

parent.on("event", "selector", "data", handler());

Answer 2

您有2个选项，可以在renderGrid之内或之外附加听众。我删除了loop_index参数，因为您不需要它：

在：

function renderGrid(render_area, dataURL, skin) {
    var grid_obj = new dhtmlXGridObject($(render_area).attr('id'));

    grid_obj.selMultiRows = true;
    grid_obj.imgURL = 'codebase/imgs/';
    grid_obj.init();
    grid_obj.setSkin(skin);
    grid_obj.load(dataURL);
    grid.attachEvent('onRowSelect', function () {
        // Or instead of an anonymous function you could use this.clickEvent
    });
}

外部（您需要从renderGrid返回网格对象：

function renderGrid(render_area, dataURL, skin) {
    var grid_obj = new dhtmlXGridObject($(render_area).attr('id'));

    grid_obj.selMultiRows = true;
    grid_obj.imgURL = 'codebase/imgs/';
    grid_obj.init();
    grid_obj.setSkin(skin);
    grid_obj.load(dataURL);

    return grid_obj;
}

var grid = renderGrid($('#grid'), '/data.xml', 'dhx_skyblue');
grid.attachEvent('onRowSelect', function () {
    // Or instead of an anonymous function you could use this.clickEvent
});

如果你想在循环中附加事件监听器，我建议先从JavaScript Garden中读取this段。

在动态创建的DHTMLX Grid上附加rowSelect事件

2 个答案: