请等待,然后再启动JavaScript函数


Wait before starting JavaScript function

每次用户收到新通知时,我都会尝试播放一个声音。我在页面上加载通知的方式很简单:

(function($)
{
    $(document).ready(function()
    {
        var $container = $("#noti");
        $container.load("notify.php");
        var refreshId = setInterval(function()
        {
            $container.load('notify.php');
        }, 1000);
    });
})(jQuery);

这是通过用PHP代码发出的任何数字更新div容器来实现的。它每秒重试一次(可能不是最有效的方式,但它很有效)。

我有另一段代码,它检查div内容何时更改,然后创建一个警报框(当脚本完成时,我会将其更改为播放声音):

var myElement = document.getElementById('noti');
if(window.addEventListener) {
   // Normal browsers
   myElement.addEventListener('DOMSubtreeModified', contentChanged, false);
} else
   if(window.attachEvent) {
      // IE
      myElement.attachEvent('DOMSubtreeModified', contentChanged);
   }
function contentChanged() {
   // this function will run each time the content of the DIV changes
         alert("js is working");
}

此脚本有效,但它也会创建警报或第一次加载通知。这是因为它一开始是一个空的div,然后加载数据,从而触发这个警报脚本。我唯一可以考虑的方法是在AJAX脚本执行任务的同时,将脚本加载延迟几秒钟。

有人知道我可以在页面加载后的前几秒延迟第二个脚本执行任何操作的方法吗,或者可能有更好的方法来绕过它吗?

与其这样做,不如使用一个自定义事件,当加载完成时触发该事件:

var refreshId = setInterval(reloadContainer, 1000)
function reloadContainer() {
    $container.load('notify.php', function success() {
        $container.trigger('loaded')
    })
}
$(myElement).on('loaded', contentChanged)