Question

我有以下Dojo Javascript片段：

postCreate: function () {
    this.inherited(arguments);
    var hitchWidgetToaddLevelButtonClickHandler = DojoBaseLang.hitch(this, addLevelButtonClickHandler);
    DojoOn(this.AddLevelButton, "click", hitchWidgetToaddLevelButtonClickHandler);

    function addLevelButtonClickHandler() {
                hierarchyLevelNumber += 1;
                var myButton = new Button({
                    label: "Click me!",
                    id: "level_button_" + hierarchyLevelNumber,
                    onClick: function(){
                        // Do something:
                        console.log("Hello there, ");
                    }
                }).placeAt(someNode,"last").startup();

                    var registeredRemovalButton = DijitRegistry.byId(("level_button_" + hierarchyLevelNumber));
                    DojoOn(registeredRemovalButton, "click", function someFunction() {
                        console.log("how are you?");
                    });
    }
}

以及以下HTML

<div id="settingsBorderContainer" data-dojo-type="dijit/layout/BorderContainer" data-dojo-props="design:'headline', gutters:false, region:'top'" class="${theme}">

    <table data-dojo-attach-point="HierarchyLevelsTable">
        <tr>
            <th>Level</th>
            <th> Table Name </th>
            <th> Column Name</th>
        </tr>
        <td id="someNode">
        </td>
    </table>
</div>

这里的目标是，当单击AddLevelButton时，它会动态地在表格中创建一行，其中包含必要的信息和每行的新按钮。请注意，HTML和Javascript在很大程度上被简化以说明我的问题。我没有包含addLevelButtonClickHandler()方法中出现的所有行逻辑。 HTMl按预期构建，如以下屏幕截图所示：

问题在于，每次添加按钮时，只有最后一个按钮的事件监听器才能工作，即在屏幕截图中，按钮在红色日志中圈出：Hello there, you called the remove handler [object MouseEvent]，以及前一个按钮不再可以单击该表并捕获必要的事件。很抱歉，如果代码是我目标的粗略简化，我感谢您提供的任何帮助。

********* EDIT **************

所以我采用了不同的方法，只放置了1个按钮，并从下到上逐级删除。只要它位于<table>之外它就起作用..这使我得出结论永远不会在一张桌子上放置或按钮经过几个小时的丢失后，如果绝对的话，我会建议你首先需要一张桌子，只需根据需要使用CSS and floats将按钮放在桌子旁边我将把这个问题保留为无人答复，直到有人能够解释为什么内部表格方法不起作用。

Answer 1

使用dojo时。您永远不应该使用node.innerHTML来添加或更新节点。它基本上将所有dijit转换为HTML字符串，并通过浏览器解析为常规HTML。这反过来会破坏与之相关的dom对象和事件。

使用dojo/dom-construct创建dom对象，并为DOM节点添加appendChild，或者在容器dijit的情况下添加addChild。

Dojo事件动态创建未处理的事件

1 个答案: