"DOMLastNodeRemoved" 之类的事件以防止多次执行代码

Event like "DOMLastNodeRemoved" to prevent multiple executions of code

首先:我知道有一些类似的问题,但我找不到任何替代方法,只好问了。

您好!

是否有类似 "DOMLastNodeRemoved"(或 FirstNode,因为您无法确定何时将是最后一个节点被删除)这样的事件来防止多次执行代码?

这是交易,我正在使用 Genexus。在这个奇怪的 SPA 概念中使事件起作用的唯一方法是使用 DOMNodeRemoved 事件。 但是每当你点击一个按钮时,它会插入很多节点,使函数执行 25 次而不是一次。

我们来看一个例子:

我目前正在使用此代码:

$(document).on("DOMNodeRemoved", function() {
$(".Button").click(function() {
    setTimeout(
        function() {
            toastrgx();
            $('.gx-warning-message').css('display', 'none');
        }, 800);
});
function toastrgx() {

    var meuLoader = new Loader($);
    meuLoader.Insert();

    setTimeout(function() {
        meuLoader.Remove();
        var text = $('.gx-warning-message').text();
        toastr.error(text, '');

    }, 500);

    };
});

我需要使用超时,因为 DOM 仍在加载消息。

无论如何,使用这段代码,我将得到图像中显示的结果:

如果我使用类似 preventPropagation 的东西(至少是我使用的方式),它只会 运行 我的代码一次,但是 returns 控制台中有很多错误(每次执行一个)并且还破坏了我的装载机。 顺便说一句,我只有一个自定义脚本的权限,其他一切都由 Genexus 生成。
所以,如果我使用任何其他正常事件,如 document.ready,它会在我第一次在我的 MasterPage 中加载页面时触发,但是,如果我单击任何其他页面,它不会再次触发该事件。

所以,我的问题是:

在我的情况下有什么方法可以只执行一次代码?
是不是我看不太清楚,比如另一个事件或使代码正常工作的另一种方式?

如果这个问题听起来很傻,抱歉,我是 JS 新手。

在这种情况下,方法是创建一个 User Control 并使用它的 show 函数,每次控件应该更新时(例如,当页面加载或修改控件的 属性 时)。

为什么要使用用户控件?

用户控件提供了一个标准接口来与 GeneXus 生成的应用程序进行互操作。这个接口很好 documented 并且让你从生成的应用程序的内部工作中抽象出来。

如果您尝试通过包含脚本来扩展 GeneXus,您将面临意外行为和更改,恕不另行通知。

如何创建用户控件

要创建用户控件,我建议使用 GeneXus User Control Generator,用于 Atom。使用此 Atom 包,您可以轻松创建 GeneXus 用户控件。

按照 steps to create a User Control 并在软件包提示支持的平台时选择 Web

如何让代码在加载页面时只执行一次

创建用户控件后,打开 src/<YourUserControlName>Render.js 文件并按如下方式编辑 show 函数:

this.show = function() {
  if (!this.IsPostBack) {
    // This code will be executed only, when the page is loaded.
  }
}

if 中,您可以编写每页只需要执行一次的代码。

如何部署用户控件

要构建用户控件并将其部署到您的 GeneXus 安装目录,请按照包文档中描述的 build process steps 进行操作。

部署用户控件后,您应该将其包含在母版页对象中以开始使用它,而不是您现在使用的脚本。