javascript - Jquery Onclick 功能不适用于 div，因为特定时间后会加载

Question

对于<div class="editdiv">Test</div> 。 document.ready 函数中添加了 Jquery 单击功能。但是editdiv延迟动态加载页面。

所以当我点击div时。函数未调用。通过使用timeout功能运行良好。

我需要一种不同的方法来解决此功能。

Answer 1

如果您的 .editdiv 是在 js 加载后动态加载的，因此您的 click 事件无法检测到它并且它将无法工作，那么您应该使用事件委托(delegate)<强>on() 处理新的 DOM :

$('body').on('click', '.editdiv', function(){
    //Your click event code
})

<小时/>

如果您想避免 setTimeout，您可以将 delay 与 queue 回调方法结合使用:

$('div.scroll-area-blue')
    .delay(5000)
    .queue(function() {
        $(this).enscroll({
             showOnHover: false,
             verticalScrolling: true,
             verticalTrackClass: 'vertical-track-blue',
             verticalHandleClass: 'vertical-handle-blue'
        });
    });

如果您将使用 setTimeout 更好地使用它，如下所示:

setTimeout( enscrollDiv, 5000); 

function enscrollDiv(){
    $('div.scroll-area-blue').enscroll({
         showOnHover: false,
         verticalScrolling: true,
         verticalTrackClass: 'vertical-track-blue',
         verticalHandleClass: 'vertical-handle-blue'
    });
}

希望这有帮助。