我如何檢測准備的DOM和所有屬性設置

Question

我有下一個html結構：

<div id="controls">    
    <div class="action" data-action="controller/action1" data-view="view1">...</div>
    <div class="action" data-action="controller/action1" data-view="view2">...</div>
    <div class="action" data-action="controller/action2" data-view="view1">...</div>
    <div class="action" data-action="controller/action2" data-view="view2">...</div>
     ...e.t.c.
</div>

在typeScript中，我嘗試獲取數據屬性並構建ajax查詢：

$('#controls').off('click').on('click','.action',(e) => {
       var $element = $(e.target),
            action = $element.data('action'),
            view = $element.data('view');

        if(!action)
            return this.sendNotification(false,'Setup action in config');
        if(!view)
            return this.sendNotification(false,'Setup view in config');

        // Ajax request and other logic 
});

我也有更新頁面部分的功能（在主題開頭包括div塊）

private updateActionsBlock() {
   $.get(location.href, (html) => {
       $('#controls').html($(html).find('#controls'));
            this.init();
   });
}

問題

如果用戶遇到Internet連接問題或計算機速度較慢（可能是瀏覽器沒有足夠的RAM），則在使用updateActionBlock()之后幾秒鍾無法從$('.action')獲取數據屬性。 這些變得不確定。

題

我如何禁用單擊$('.action'); 在DOM准備好之前？

我希望有可能沒有setTimeout

Answer 1

問題不在DOM中。

$('#controls').off('click').on('click','.action',(e) => {
       var $element = $(e.target),
            action = $element.data('action'),
            view = $element.data('view');

        if(!action)
            return this.sendNotification(false,'Setup action in config');
        if(!view)
            return this.sendNotification(false,'Setup view in config');

        // Ajax request and other logic 
});

有時，當我單擊.action時， e.target元素錯誤。 我獲得了內部元素，而不是<div class='action'>...</div> 。

因此，當我將e.target更改為e.currentTarget Bug已修復。